微信小程序tab栏切换

最新推荐文章于 2024-07-09 20:40:58 发布

qq_29069777

最新推荐文章于 2024-07-09 20:40:58 发布

阅读量273

点赞数 1

分类专栏：前端文章标签： web前端

原文链接：https://www.mk2048.com/blog/blog.php?id=h0bjkj0bahaa&title=%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8Ftab%E6%A0%8F%E5%88%87%E6%8D%A2

版权

前端专栏收录该内容

1175 篇文章 2 订阅

订阅专栏

index.wxml

<text  data-current="0" class="{{currentTab == 0? 'active' : ''}}">消息</text>
<text  data-current="1" class="{{currentTab == 1 ? 'active' : ''}}">通知</text>
<view hidden="{{isShow}}">消息</view>
<view hidden="{{!isShow}}">消息</view>

index.js

data: {
    isShow: true,
    currentTab: 0
}
switcher: function (e) {
        if (this.data.currentTab == e.target.dataset.current) {
            return false
        } else {
            var showMode = e.target.dataset.current == 0;
            this.setData({
                currentTab: e.target.dataset.current,
                isShow: showMode
            })
        }
    },

更多专业前端知识，请上【猿2048】www.mk2048.com