微信小程式中的【tabBar】-建立底部導航菜單

​

​app.json​

​檔案用來對微信小程式進行全局配置，決定頁面檔案的路徑、視窗表現、設定網絡逾時時間、設定多 tab 等。

解釋一下 對應的屬性資訊

tabBar  指底部的 導航配置屬性

color  未選擇時 底部導航文字的顔色

selectedColor  選擇時 底部導航文字的顔色

borderStyle  底部導航邊框的樣色（注意 這裡如果沒有寫入樣式 會導緻 導航框上邊框會出現預設的淺灰色線條）

list   導航配置數組

selectedIconPath 選中時 圖示路徑

iconPath 未選擇時 圖示路徑

pagePath 頁面通路位址

text  導航圖示下方文字

如果要改變更詳細的樣式 請參看

​​https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html#tabBar​​

"tabBar": {

"list": [

{

"pagePath":

"pages/index/index",

"text":

"首頁",

"selectedIconPath":

"pages/images/icon_seo_HL.png",

"iconPath":

"pages/images/icon_seo.png"

},

{

"pagePath":

"pages/logs/logs",

"text":

"日志"

},

{

"pagePath":

"pages/logs/logs",

"text":

"我的設定",

"selectedIconPath":

"pages/images/icon_speed_HL.png",

"iconPath":

"pages/images/icon_speed.png"

}

],

"color":

"#8B4513",

"selectedColor":

"#FF6347"

}