微信小程序開發(fā)之如何實(shí)現(xiàn)選項(xiàng)卡頁面切換

這篇文章給大家分享的是有關(guān)微信小程序開發(fā)之如何實(shí)現(xiàn)選項(xiàng)卡頁面切換的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過來看看吧。

微信小程序開發(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目錄下寫好頁面即可切換.

感謝各位的閱讀！關(guān)于“微信小程序開發(fā)之如何實(shí)現(xiàn)選項(xiàng)卡頁面切換”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！