微信小程序自定义tabbar

微信小程序自定义Tabbar官方网址

启动自定义Tabbr

配置自定义tabbar

全局注册

先在app.json文件中的tabbar属性中的list属性中写入，你需要使用的tabbar页面的信息如下图。

2.配置自定义组件

在根目录下创建custom-tab-bar文件夹，并生成对应的组件。

在custom-tab-bar文件夹中定义好自己的自定义tabbar。我们就可以看到下面的内容以及成功的显示。

3.配置每个页面的getTabBar

前往你的tabbar页面的js文件中，找到onshow函数，在函数中添加如下代码

上图是组件，下面是页面

      if (typeof this.getTabBar === 'function' &&
        this.getTabBar()) {
        this.getTabBar().setData({
          selected: 0  // 注意这里：需要配置成你自定义组件页面中对应的变量
        })
      }