全局配置 tabBar

如果小程序是一个多 tab 应用（客户端窗口的底部或顶部有 tab 栏可以切换页面），可以通过 tabBar 配置 tab 切换时显示的对应页面

tabBar 属性

属性	类型	必填	默认值	描述
color	HexColor	是		tab 上的文字默认颜色，仅支持十六进制颜色
selectedColor	HexColor	是		tab 上的文字选中时的颜色，仅支持十六进制颜色
backgroundColor	HexColor	是		tab 的背景色，仅支持十六进制颜色
borderStyle	string	否	black	tabbar 上边框的颜色， 仅支持 black / white
list	Array	是		tab 的列表，详见 list 属性说明，最少 2 个、最多 5 个 tab
position	string	否	bottom	tabBar 的位置，仅支持 bottom / top

---

常用属性是 list ,其中 list 接受一个数组，只能配置最少 2 个、最多 5 个 tab

List 属性说明

属性	类型	必填	说明
pagePath	string	是	页面路径，必须在 pages 中先定义
text	string	是	tab 上按钮文字
iconPath	string	否	图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。 当 position 为 top 时，不显示 icon。
selectedIconPath	string	否	选中时的图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。 当 position 为 top 时，不显示 icon。

修改app.json配置文件，增加tabBar属性配置

"tabBar": {
  "color":"#999999",
  "selectedColor":"#ff0000",
  "backgroundColor":"#fff",
  "borderStyle":"black",
  "position":"bottom",
  "list": [{
    "pagePath": "pages/index/index",
    "text": "首页",
    "iconPath":"./images/home.png",
    "selectedIconPath":"./images/home_select.png"
   }, {
    "pagePath": "pages/news/news",
    "text": "新闻",
    "iconPath": "./images/news.png",
    "selectedIconPath": "./images/news_select.png"
   }]
},

至此，本章节的学习就到此结束了，如有疑惑，可对接技术客服进行相关咨询。