微信官方文档对自定义 tabBar 的阐述较为潦草,在开发自定义 tabBar 过程中我踩了很多坑,因此在此处做个总结。
我使用 Vant Weapp 作为 UI 组件库,下面以此组件库为例。
定义 tabBar
创建自定义 tabBar 文件
创建一个与 /pages 的同级目录,命名为 /custom-tab-bar,注意目录层级与目录命名问题,不可用其他名称命名。
在 /custom-tab-bar 下创建四个文件:
index.js
index.json
index.wxml
index.wxss
index.js
在 index.js 中我们定义相关数据:
active: