微信小程序底部导航栏

例：

注意：对于底部导航栏，添加的导航最少两个，最多五个。

代码：在根目录下找到app.json文件

{
  "pages": [
    "pages/order/order",
    "pages/index/index",
    "pages/demo/demo",
    "pages/login/login",
    "pages/logs/logs"
   
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#808080",
    "navigationBarTitleText": "test",
    "navigationBarTextStyle": "white"
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json",
  "lazyCodeLoading": "requiredComponents",
  "tabBar": {
    "list": [
      {
        "selectedIconPath": "pages/images/1.png",
        "iconPath": "pages/images/1.png",
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "selectedIconPath": "pages/images/2.png",
        "iconPath": "pages/images/2.png",
        "pagePath": "pages/login/login",
        "text": "我的"
      }
    ]
  }
}

其中各属性的意思

tabBar 指底部的 导航配置属性

list 导航配置数组

selectedIconPath 选中时 图标路径

iconPath 未选择时 图标路径

pagePath 页面访问地址

text 导航图标下方文字

注意：

这个页面的注册一定要注意，第一个一定是要是最先显示的，否则会出现底部导航看不到