底部菜單欄是一種在手機app上很常用的設計，如微信：
也許是微信小程序考慮到這種設計很常用，在微信小程序中只需要簡單的配置就能達到這種效果：在app.json中配置tabBar屬性。具體步驟如下：
- 準備好幾個頁面：在app.json中配置pages屬性，微信開發工具會自動創建對應的文件。
2.分別為每個頁面設置一些內容作為區別，如me頁面。
3.準備幾張圖片作為tab項的圖標。可以在項目的根目錄中創建一個目錄來存放圖片。
4.準備工作完成。關鍵在於配置tabBar屬性：
如上圖配置了tabBar的3個屬性。backgroundColor是整個tabBar的背景顏色，selectedColor是當前選中項的文字顏色。list是tab項的列表，每一個tab項是一個對象，包含了4個屬性：pagePath是tab項對應頁面的路徑，就是第1步中準備好的路徑。text是tab項的文字。iconPath是tab項的圖標，selectedIconPath是tab項選中狀態時的圖標。
通過以上配置後的顯示效果如下圖：
雖然有點醜，但是很直觀。
分享到:
閱讀更多 程序員fearlazy 的文章
