自定义tabbar
<view class="tabbar" wx:if="{{ showTabBar }}">
    <view class="tabbar-container">
        <block wx:for="{{actives}}" wx:key="id">
            <view class="tabbar-item" data-item="{{item}}" style="color: {{activeIndex === item.id ? mainColor : '#999999'}}" bind:tap="changeIndex">
                <view>
                    <text class="{{item.iconPath}}"></text>
                </view>
                <text class="item-title">{{item.name}}</text>
            </view>
        </block>
    </view>
</view>
Component({
    properties: {
    },
    data: {
        actives: [{
                iconPath: 'iconfont icon-a-Frame1',
                name: '首页',
                pagePath: '/pages/index/index',
                id: 0
            },
            {
                iconPath: 'iconfont icon-a-Frame2',
                name: '卡券',
                pagePath: '/pages/ticket/index',
                id: 1
            },
            {
                iconPath: 'iconfont icon-a-Frame3',
                name: '我的',
                pagePath: '/pages/mine/index',
                id: 2
            },
        ],
        activeIndex: 0,
        mainColor: getApp().globalData.mainColor,
        showTabBar: true
    },
    methods: {
        changeIndex(e) {
            const item = e.currentTarget.dataset.item;
            this.setData({
                activeIndex: item.id
            })
            wx.switchTab({ url:item.pagePath });
        },
    }
})