微信小程序開發(fā)之選項(xiàng)卡(窗口底部TabBar)頁面切換
更新時(shí)間：2017年04月12日 09:43:11 作者：dzp_coder
本文主要介紹了微信小程序開發(fā)之選項(xiàng)卡(窗口底部TabBar)頁面切換的相關(guān)知識。具有很好的參考價(jià)值。下面跟著小編一起來看下吧
微信小程序開發(fā)中窗口底部tab欄切換頁面很簡單很方便.
代碼:
1.app.json
//app.json
{
"pages":[
"pages/index/index",
"pages/logs/logs"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#999999",
"navigationBarTitleText": "tab",
"navigationBarTextStyle":"white"
},
"tabBar": {
"color": "#ccc",
"selectedColor": "#35495e",
"borderStyle": "white",
"backgroundColor": "#f9f9f9",
"list": [
{
"text": "首頁",
"pagePath": "pages/index/index",
"iconPath": "images/home.png",
"selectedIconPath": "images/home-actived.png"
},
{
"text": "目錄",
"pagePath": "pages/catalogue/catalogue",
"iconPath": "images/note.png",
"selectedIconPath": "images/note-actived.png"
},
{
"text": "我的",
"pagePath": "pages/mine/mine",
"iconPath": "images/profile.png",
"selectedIconPath": "images/profile-actived.png"
}
]
}
} pagePath是頁面路徑.iconPath是圖片路徑，icon 大小限制為40kb.
selectedIconPath:選中時(shí)的圖片路徑，icon 大小限制為40kb
tab Bar的最多5個(gè),最少2個(gè).
在pages目錄下寫好頁面即可切換.
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時(shí)也希望多多支持腳本之家！
相關(guān)文章
理解JavaScript設(shè)計(jì)模式中的建造者模式
這篇文章主要介紹了理解JavaScript設(shè)計(jì)模式中的建造者模式,文章基于JavaScript的相關(guān)資料展開箱子內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-04-04
JavaScript Cookie顯示用戶上次訪問的時(shí)間和次數(shù)
用cookies記錄用戶的訪問時(shí)間與次數(shù)，然后再次訪問時(shí)，在讀取。2009-12-12
map和set一樣是關(guān)聯(lián)式容器,它們的底層容器都是紅黑樹,區(qū)別就在于map的值不作為鍵,鍵和值是分開的,下面這篇文章主要給大家介紹了關(guān)于js中Map和Set的用法及區(qū)別的相關(guān)資料,需要的朋友可以參考下2022-02-02![JS中的==運(yùn)算： [''''] == false —>true](http://img.jbzj.com/images/xgimg/bcimg3.png)
JS中的==運(yùn)算： [''''] == false —>true
這篇文章主要介紹了JS中的==運(yùn)算： [''] == false —>true的相關(guān)資料,非常不錯，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-07-07
這篇文章主要介紹了JavaScript中跨域調(diào)用Flash的方法,只需要在Flash中加一句話即可,需要的朋友可以參考下2014-08-08
本文主要介紹了js跨域的幾種解決方案,主要介紹了8種方式,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-05-05
單擊復(fù)制文字的js找了很久，由于之前沒有接觸過，完全不知道兼容ie及標(biāo)準(zhǔn)dom瀏覽器，不僅僅要通過js，而且需要flash的幫忙，下面與大家分享下具體的實(shí)現(xiàn)方法2013-07-07
js 巧妙去除數(shù)組中的重復(fù)項(xiàng)
最近, 我在看YAHOO.util.YUILoader類的源碼, 其中有個(gè)排除數(shù)組重復(fù)項(xiàng)的方法, 讓我覺得甚為巧妙, 這里分享下…2010-01-01
全面解析Bootstrap中nav、collapse的使用方法
這篇文章主要為大家詳細(xì)解析了Bootstrap中nav、collapse的使用方法，感興趣的朋友可以參考一下2016-05-05
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)日歷功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-11-11