微信小程序 TabBar设置

一、创建tabbar

app.json中,tabbar按照如下写法设置,

"tabBar": {
    "color": "#8a8a8a",
    "selectedColor": "#1296db",
    "backgroundColor": "#e6e6e6",
    "list": [
      {
        "pagePath": "pages/home/home",
        "text": "首页",
        "iconPath": "/images/tabs/main.png",
        "selectedIconPath": "/images/tabs/main1.png"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "消息",
        "iconPath": "/images/tabs/message.png",
        "selectedIconPath": "/images/tabs/message1.png"
      },
      {
        "pagePath": "pages/mine/mine",
        "text": "我的",
        "iconPath": "/images/tabs/main.png",
        "selectedIconPath": "/images/tabs/main1.png"
      }
    ]
  },

tabbar和pages等同级

二、设置进入首页

 "pages":[
    "pages/home/home",
    "pages/index/index",
    "pages/mine/mine"
  ],

如果想修改默认选中的tab,只需要修改"pages"数组里的顺序即可。放在前面的会优先选中。
比方说我想优先展示“我的”(mine)界面,将pages里的界面改成如下顺序即可。

"pages":[
    "pages/mine/mine",
    "pages/home/home",
    "pages/index/index"
  ],

猜你喜欢

转载自blog.csdn.net/guoxulieying/article/details/133267651