[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 導航圖標下方文字