微信小程序添加底部自定义导航栏(tabBar)

tabBar参数说明参考: 官网文档

具体配置:

1、在app.json中添加你的自定义导航栏信息(名字,点击前图片,点击后图片,要跳转的界面等等)

注意事项:tabBar最多五个

 

参考示例:

"tabBar": {
    "color": "#8a8a8a",
    "selectedColor": "#937bf5",
    "list": [
      {
        "iconPath": "images/tabbar/index.png",
        "selectedIconPath": "images/tabbar/index_active.png",
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "iconPath": "images/tabbar/near.png",
        "selectedIconPath": "images/tabbar/near_active.png",
        "pagePath": "pages/near/near",
        "text": "附近"
      },
      {
        "iconPath": "images/tabbar/message.png",
        "selectedIconPath": "images/tabbar/message_active.png",
        "pagePath": "pages/message/message",
        "text": "消息"
      },
      {
        "iconPath": "images/tabbar/user.png",
        "selectedIconPath": "images/tabbar/user_active.png",
        "pagePath": "pages/user/user",
        "text": "我的"
      }
    ]
  }
View Code

 

posted @ 2020-02-20 14:30  狼窝窝  阅读(3485)  评论(0编辑  收藏  举报