The tabBar of the small program entry series

This series is a simple introductory series, which describes the content with a certain general idea, you can check the official website for details


Most of the 电商applications are bottom or top 多 tab 的模式. Below we analyze from the configuration point of view:

The first one: the positionconfiguration is as follows:

The default is bottom, you can also set top to change the position of tabBar

Second: The listconfiguration is as follows:

Required parameters:

  • text text, if the position is bottom, it will appear below the icon
  • pagePath jump path

Optional parameters: if position is set to top, it will not be displayed

  • iconPath The path of the default icon
  • selectedIconPath selected icon path

These two are not supported 网络图片, the recommended size is 81 * 81

But please note:

1. At least two, otherwise an error will be reported:

tabBar.list must contain at least 2 items

2. Up to 5,

tabBar.list cannot exceed 5 items

3. The pagePath inside cannot be empty, and needs to be defined in the pages array

Third: Settings text 文字的颜色

  • color The default text color
  • selectedColor selected text color

the fourth:tabBar 的背景和边框

  • borderStyle The color of the border, the default is black, supports both white and black
  • backgroudColor background color

Guess you like

Origin www.cnblogs.com/10manongit/p/12698090.html