微信小程序tabBar底部導航中文注解api詳解

2019-11-19 15:46:43

字體：大中小

來源：轉載

供稿：網友

微信小程序tabBar底部導航中文注解api，信小程序tabBar就是app底部的那個導航欄，可以放1-5導航鏈接，這里對微信小程序底部導航tabbar的中文解釋。
微信小程序tabBar是在全局app.json文件里面配置的。

小程序tabBar配置代碼注解

{  "pages":[    "pages/index/index",    "pages/detail/detail"  ],  "window":{    "navigationBarTitleText": "TabBar",    "navigationBarBackgroundColor": "#F60",    "navigationBarTextStyle": "white"  },  //tabBar注意是B是大寫，有朋友提問運行時tab沒出現，檢查是不是這里手誤  "tabBar":{  //文檔指出color是必填項，其實可為空，不重寫color就是深灰，樣式更統一    "color": "#ddd",  //同樣，文檔指出selectedColor是必填項，不過selectedColor有必要重寫，區分當前項與普通項    "selectedColor": "#3cc51f",  //同樣，文檔指出color是必填項，其實可為空，不重寫backgroundColor就是淺灰，樣式更統一。    "backgroundColor": "#fff",  //borderStyle，不寫默認就是黑，那就黑好了，white的話，會少一條分隔線，跟頁面混在一起了    "borderStyle":"black",    "list":[{        "pagePath":"pages/index/index",  //iconPath圖標是非必填，只是tab欄會變矮，自然selectedIconPath也可不寫        "iconPath":"image/icon_API.png",        "selectedIconPath":"image/icon_API_HL.png",        "text":"index"      },{        "pagePath":"pages/detail/detail",        "iconPath":"image/icon_component.png",        "selectedIconPath":"image/icon_component_HL.png",        "text":"detail"      }]  }}

小程序tabBar參數說明

如果我們的小程序是一個多 tab 應用（客戶端窗口的底部有tab欄可以切換頁面），那么我們可以通過 tabBar 配置項指定 tab 欄的表現，以及 tab 切換時顯示的對應頁面。

tabBar 是一個數組，只能配置最少2個、最多5個 tab，tab 按數組的順序排序。

屬性說明：