微信小程序自定义tabbar切换闪烁问题

// pages/custom-tab-bar/index.ts

Component({
    data: {
        selected: '',//默认为空
        list: [// tab 
            { id: 'wait', label: '待办', url: '/pages/wait/wait', icon: 'time' },
            { id: 'work', label: '工作台', url: '/pages/work/work', icon: 'laptop' },
            { id: 'mime', label: '我的', url: '/pages/mime/mime', icon: 'user' },
        ]
    },
  
    methods: {
        switchTab(e: WechatMiniprogram.BaseEvent) {
            const data = e.currentTarget.dataset
            const url = data.url;
            if (this.data.selected == data.id) return;
            // 跳转页面
            wx.switchTab({ url });
            //  跳转页面的key 存到全局状态内
            const app = getApp<IAppOption>();
            app.globalData.currentTab = data.id
        }
    }
})

// pages/home/home.ts

Page({
    onShow() { 
        const app = getApp<IAppOption>()
        this.getTabBar().setData({ selected: app.globalData.currentTab })
    },
});


// app.ts

App<IAppOption>({
    globalData: {
        currentTab: 'wait',
    },
    onLaunch() {

    },
})

最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容