微信小程序 底部导航栏

每日推下我的Git地址

我的Git小程序代码地址:https://github.com/daimananshen/muCeGoodTime

1、小程序官方文档-导航栏的属性
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html

image.png

2、代码 app.json 页面

{
  "pages": [
    "pages/index/index",
    "pages/myCenter/myCenter",
    "pages/chat/chat",
    "pages/search/search"
  ],
  "window": {
    "backgroundColor": "#F6F6F6",
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#F6F6F6",
    "navigationBarTitleText": "沐测好时光",
    "navigationBarTextStyle": "black"
  },
  "tabBar": {
    "selectedColor":"#d81e06",
    "list": [
      {
        "pagePath": "pages/index/index",
        "iconPath": "images/index.png",
        "selectedIconPath": "images/index2.png", 
        "text": "首页"
      },
      {
        "pagePath": "pages/search/search",
        "iconPath": "images/search.png",
        "selectedIconPath": "images/search2.png", 
        "text": "搜索"
      },
      {
        "pagePath": "pages/chat/chat",
        "iconPath": "images/chat.png",
        "selectedIconPath": "images/chat2.png", 
        "text": "聊天"
      },
      {
        "pagePath": "pages/myCenter/myCenter",
        "iconPath": "images/myCenter.png",
        "selectedIconPath": "images/myCenter2.png", 
        "text": "个人中心"
      }
    ]
  },
  "sitemapLocation": "sitemap.json",
  "style": "v2"
}

3、效果 (图片在git上)

image.png