初始

custom-tab-bar/index.js

@@ -0,0 +1,50 @@
+Component({
+  options: {
+    addGlobalClass: true
+  },
+
+  data: {
+    active: 0,
+    list: [
+      {
+        pagePath: '/pages/index/index',
+        text: '首页',
+        icon: 'home-o',
+        activeIcon: 'wap-home'
+      },
+      {
+        pagePath: '/pages/category/category',
+        text: '分类',
+        icon: 'apps-o',
+        activeIcon: 'apps-o'
+      },
+      {
+        pagePath: '/pages/mine/mine',
+        text: '我的',
+        icon: 'user-o',
+        activeIcon: 'manager'
+      }
+    ]
+  },
+
+  methods: {
+    onChange(e) {
+      const index = e.detail;
+      const item = this.data.list[index];
+      
+      wx.switchTab({
+        url: item.pagePath
+      });
+    },
+
+    init() {
+      const page = getCurrentPages().pop();
+      const route = page ? `/${page.route}` : '';
+      const active = this.data.list.findIndex(item => item.pagePath === route);
+      
+      if (active !== -1) {
+        this.setData({ active });
+      }
+    }
+  }
+});

custom-tab-bar/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-tabbar": "@vant/weapp/tabbar/index",
+    "van-tabbar-item": "@vant/weapp/tabbar-item/index"
+  }
+}

custom-tab-bar/index.wxml

@@ -0,0 +1,5 @@
+<van-tabbar active="{{ active }}" bind:change="onChange" active-color="#1890ff" inactive-color="#999999">
+  <van-tabbar-item wx:for="{{ list }}" wx:key="pagePath" icon="{{ item.icon }}">
+    {{ item.text }}
+  </van-tabbar-item>
+</van-tabbar>

custom-tab-bar/index.wxss

@@ -0,0 +1 @@
+/* custom-tab-bar/index.wxss */