微信小程序tabBar底部導(dǎo)航中文注解api詳解
微信小程序tabBar底部導(dǎo)航中文注解api，信小程序tabBar就是app底部的那個(gè)導(dǎo)航欄，可以放1-5導(dǎo)航鏈接，這里對(duì)微信小程序底部導(dǎo)航tabbar的中文解釋。
微信小程序tabBar是在全局app.json文件里面配置的。
小程序tabBar配置代碼注解
{
"pages":[
"pages/index/index",
"pages/detail/detail"
],
"window":{
"navigationBarTitleText": "TabBar",
"navigationBarBackgroundColor": "#F60",
"navigationBarTextStyle": "white"
},
//tabBar注意是B是大寫，有朋友提問運(yùn)行時(shí)tab沒出現(xiàn)，檢查是不是這里手誤
"tabBar":{
//文檔指出color是必填項(xiàng)，其實(shí)可為空，不重寫color就是深灰，樣式更統(tǒng)一
"color": "#ddd",
//同樣，文檔指出selectedColor是必填項(xiàng)，不過selectedColor有必要重寫，區(qū)分當(dāng)前項(xiàng)與普通項(xiàng)
"selectedColor": "#3cc51f",
//同樣，文檔指出color是必填項(xiàng)，其實(shí)可為空，不重寫backgroundColor就是淺灰，樣式更統(tǒng)一。
"backgroundColor": "#fff",
//borderStyle，不寫默認(rèn)就是黑，那就黑好了，white的話，會(huì)少一條分隔線，跟頁面混在一起了
"borderStyle":"black",
"list":[{
"pagePath":"pages/index/index",
//iconPath圖標(biāo)是非必填，只是tab欄會(huì)變矮，自然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參數(shù)說明
如果我們的小程序是一個(gè)多 tab 應(yīng)用（客戶端窗口的底部有tab欄可以切換頁面），那么我們可以通過 tabBar 配置項(xiàng)指定 tab 欄的表現(xiàn)，以及 tab 切換時(shí)顯示的對(duì)應(yīng)頁面。
tabBar 是一個(gè)數(shù)組，只能配置最少2個(gè)、最多5個(gè) tab，tab 按數(shù)組的順序排序。
屬性說明：
其中 list 接受一個(gè)數(shù)組，數(shù)組中的每個(gè)項(xiàng)都是一個(gè)對(duì)象，其屬性值如下：
以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript+Html5實(shí)現(xiàn)按鈕復(fù)制文字到剪切板功能(手機(jī)網(wǎng)頁兼容)
在學(xué)習(xí)javascript的過程中，遇到一個(gè)問題就是基于JavaScript+Html5實(shí)現(xiàn)按鈕復(fù)制文字到剪切板功能，下面小編給大家分享下我的實(shí)現(xiàn)思路，感興趣的朋友可以參考下2017-03-03
微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動(dòng)畫
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動(dòng)畫，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-06-06
基于javascript bootstrap實(shí)現(xiàn)生日日期聯(lián)動(dòng)選擇
這篇文章主要介紹了基于javascript bootstrap實(shí)現(xiàn)生日日期聯(lián)動(dòng)選擇的相關(guān)資料,需要的朋友可以參考下2016-04-04
這篇文章主要介紹了基于js判斷瀏覽器是否支持webGL,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-04-04
JS簡單實(shí)現(xiàn)無縫滾動(dòng)效果實(shí)例
這篇文章主要介紹了JS簡單實(shí)現(xiàn)無縫滾動(dòng)效果,結(jié)合完整實(shí)例形式分析了javascript實(shí)現(xiàn)圖片無縫滾動(dòng)效果的實(shí)現(xiàn)技巧,涉及javascript結(jié)合時(shí)間函數(shù)定時(shí)觸發(fā)動(dòng)態(tài)修改頁面元素屬性的相關(guān)操作方法,需要的朋友可以參考下2016-08-08
這篇文章主要給大家介紹了關(guān)于如何在JS中如何使用css變量以及export之javascript關(guān)鍵字的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2021-09-09
在js的嵌套for循環(huán)異步執(zhí)行,聲明i和使用i獲取到的變量 都要用 let 聲明,不要用var,這篇文章主要介紹了JS的for循環(huán)中的var和let,需要的朋友可以參考下2024-05-05
PHP abstract與interface之間的區(qū)別
本文是對(duì)PHP中abstract與interface之間的區(qū)別進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2013-11-11
div浮層,滾動(dòng)條移動(dòng),位置保持不變的4種方法匯總
這篇文章主要是對(duì)div浮層,滾動(dòng)條移動(dòng),位置保持不變的4種方法進(jìn)行了匯總介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2013-12-12
解決前端接收 type:"application/octet-stream" 格
前端接收 type: “application/octet-stream“ 格式的數(shù)據(jù)并下載,還有后端既返回octet-stream還返回JSON數(shù)據(jù)時(shí)的處理方法,今天給大家分享前端接收 type:"application/octet-stream" 格式的數(shù)據(jù)并下載(解決后端返回不唯一問題)的解決方案,感興趣的朋友一起看看吧2023-12-12