微信小程序tabBar的使用，导航栏实例

微信小程序的导航栏，也就是标题栏的格式是规定好的，不可以改动。同样，小程序提供的Tab栏也是规定好的格式，不过可以修改其属性。

下面附上使用方法：

比如，如果希望在APP的首页设置tabbar,则在app.json里添加如下代码：

{  "pages":[    "pages/index/index",    "pages/components/mine/mine"  ],  "window":{    "backgroundColor":"#f4f4f4",    "backgroundTextStyle":"light",    "navigationBarBackgroundColor": "#FF5722",    "navigationBarTitleText": "测试",    "navigationBarTextStyle":"#FFFFFF"  },  "tabBar": {    "color": "#959394",  //文字默认颜色    "selectedColor": "#959394",//文字被选中时的颜色    "backgroundColor": "#f0f0f0",//背景色    "borderStyle": "white",//TAB栏边框颜色    "list": [      {        "pagePath": "pages/index/index", //导航页面        "iconPath": "pages/images/home_b.png",//默认图片路径        "selectedIconPath": "pages/images/home.png",//被选中时的图片路径        "text": "首页"      },      {        "pagePath": "pages/components/mine/mine",        "iconPath": "pages/images/mine_b.png",        "selectedIconPath": "pages/images/mine.png",        "text": "帮助"      }    ]  }}

注：每个page都可以添加tabBar,子页面的会覆盖app.json的内容。

如果希望点击时容易识别，建议“iconPath”和'selectedIconPath"这张图片不同。

体验自然语言查询小程序可以用微信扫下面的头像，

或者直接下载代码：

微信小程序Demo

 技术交流群：