App下載
5. 全局配置-下
微信小程序入門課程 / 5. 全局配置-下
手機也能上課
App下載
1/4

app.json-tabBar

如果小程序是一個多 tab 應用(客戶端窗口的底部或頂部有 tab 欄可以切換頁面),可以通過 tabBar 配置項指定 tab 欄的表現(xiàn),以及 tab 切換時顯示的對應頁面。 

 Tip:當設置 position 為 top 時,將不會顯示 icon。tabBar 中的 list 是一個數(shù)組,只能配置最少2個,最多5個 tab。tab 按數(shù)組的順序排序。

屬性說明: 

屬性類型必填默認值描述
colorHexColortab 上的文字默認顏色
selectedColorHexColortab 上的文字選中時的顏色
backgroundColorHexColortab 的背景色
borderStyleStringblacktabbar上邊框的顏色, 僅支持 black/white
listArraytab 的列表,詳見 list 屬性說明,最少2個、最多5個 tab
positionStringbottom可選值 bottom、top

其中 list 接受一個數(shù)組,數(shù)組中的每個項都是一個對象,其屬性值如下: 

屬性類型必填說明
pagePathString頁面路徑,必須在 pages 中先定義
textStringtab 上按鈕文字
iconPathString圖片路徑,icon 大小限制為40kb,建議尺寸為 81px * 81px,當 postion 為 top 時,此參數(shù)無效,不支持網(wǎng)絡圖片
selectedIconPathString選中時的圖片路徑,icon 大小限制為40kb,建議尺寸為 81px * 81px ,當 postion 為 top 時,此參數(shù)無效

執(zhí)行結果:


+10 經(jīng)驗 +10積分
解析
提示
參考答案
+10 經(jīng)驗 +10積分
視頻播放結束,是否學習下一節(jié)?