先看一下自定義底部導航（圖1）和未自定義的導航（圖2）效果差距
圖1
圖2如何實現自定義底部導航
建立乙個與pages同級的資料夾，名稱為custom-tab-bar資料夾名字是規定好的只能叫做這個。
建立好這個資料夾之後就是編寫底部導航的內容
5. 完成到上一步之後已經可以實現頁面的切換效果了，但是頁面切換了，但是底部導航的選中狀態並沒有實現對應的選中效果
接下來需要在每個展示頁面的onshow鉤子函式中編寫實現底部導航和頁面對應的選中效果
首頁是第乙個頁面所以currentindex的值設為0，後面依次為，page1頁面就是1，page2頁面就是2.....
到這裡就實現了乙個簡單的底部導航。可以根據自己專案的業務需求自定義更為複雜的底部導航。位置也可以不在底部，具體修改custom-tab-bar下面的樣式檔案即可。
如果控制台有下圖警告
只需要在project.config.json檔案中找到"checksitemap"改為false即可。
微信小程式自定義底部導航tabBar
custom tab bar資料夾要與pages檔案同級，custom tab bar之下的檔案名字為index 官方文件推薦用 fixed 在底部的 cover view cover image 元件渲染樣式，以保證 tabbar 層級相對較高。但是我是在真機除錯時遇到tabbar偶爾消失的bug...
微信小程式底部導航
tabbar 複製 配置的引數 tabbar 指底部的 導航配置屬性 color 未選擇時 底部導航文字的顏色 selectedcolor 選擇時 底部導航文字的顏色 borderstyle 底部導航邊框的樣色 注意 這裡如果沒有寫入樣式 會導致 導航框上邊框會出現預設的淺灰色線條 list 導航配...
微信小程式之自定義底部彈出框動畫
最近做小程式時，會經常用到各種彈框。直接做顯示和隱藏雖然也能達到效果，但是體驗性太差，也比較簡單粗暴。想要美美地玩，新增點動畫還是非常有必要的。下面做乙個底部上滑的彈框。wxml view class modals modals bottom dialog hidden view class mod...