微信小程式tabBar 底部選單欄不顯示的問題解決
阿新 • • 發佈:2018-12-03
問題闡述:
在寫微信小程式時需要用到tabBar這個功能,但是在app.json檔案中寫好pages和tabBar儲存重新整理編譯後,預覽頁面中沒有顯示底部tab
"pages": [ "pages/index/index", "pages/todo/todo", "pages/diary/diary", "pages/record/record" ], "window": { "backgroundColor": "#F6F6F6", "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#F6F6F6", "navigationBarTitleText": "demo", "navigationBarTextStyle": "black" }, "tabBar": { "list": [{ "pagePath": "pages/todo/todo", "text": "one" },{ "pagePath": "pages/diary/diary", "text": "two" },{ "pagePath": "pages/record/record", "text": "three" } ] }
問題解決:
1、將pages中的tab頁面放到前面,但是index會無法顯示,頁面直接是tab內容
"pages": [
"pages/todo/todo",
"pages/diary/diary",
"pages/record/record",
"pages/index/index"
],
2、比較好的解決方法是讓 tabBar 中包含 index 初始頁面這一項
"tabBar": { "list": [{ "pagePath": "pages/index/index", "text": "one" },{ "pagePath": "pages/diary/diary", "text": "two" },{ "pagePath": "pages/record/record", "text": "three" } ] }
這樣問題就解決了,再次儲存重新整理編譯,底部成功顯示出tabBar