[TOC]
## 第一步:创建两个页面
* 可在app.json中快捷创建
```
"pages": [
"pages/index/index",
"pages/list/list"
],
```
## 第二步:在app.json中添加**tabBar**
```
"tabBar": {
"color": "#cccccc",
"selectedColor": "#0065FA",
"backgroundColor": "#ffffff",
"borderStyle": "black",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "images/yuedu.png",
"selectedIconPath": "images/yuedu_hl.png"
},
{
"pagePath": "pages/list/list",
"text": "电影",
"iconPath": "images/dianying.png",
"selectedIconPath": "images/dianying_hl.png"
}
]
}
```
### 对应的属性信息
* tabBar 指底部的 导航配置属性
* color 未选择时 底部导航文字的颜色
* selectedColor 选择时 底部导航文字的颜色
* borderStyle 底部导航边框的样色(注意 这里如果没有写入样式 会导致 导航框上边框会出现默认的浅灰色线条)
* list 导航配置数组
* selectedIconPath 选中时 图标路径
* iconPath 未选择时 图标路径
* pagePath 页面访问地址
* text 导航图标下方文字