小程序
小游戏
企业微信
微信支付
扫描小程序码分享
135 个评论
加粗
标红
插入代码
插入链接
插入图片
上传视频
都 2023年中旬了， 官方还没给个答复，也是醉了，，，，，，
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
都 2021年中旬了， 官方还没给个答复，也是醉了，，，，，，
其实他要是多个页面都用同一个tabbar实例可能就没有这个问题了
现在都2022年了，这么多用户反馈了2年多的问题还解决不了吗，我不相信以腾讯的实力解决不了这个问题，如果个别开发人员解决不了这个问题，腾讯这么多技术大佬能帮忙解决下吗。
2020-11-25发布的问题，今天是2021-07-27，还没解决么，绩效扣光了！
可以将原来放置 image 标签的位置，替换为两个 image 标签，一个存放选中图片路径，一个存放未选中图片路径，然后通过 selected 状态来控制是否展示元素（将不需要展示的元素设置为 visibility: hidden;）。
此时页面会同时渲染所有的 icon 图片，即使不需要展示，也会渲染，因此会有一个透明的占位，此时可以使用 position: absolute 布局来使其重叠展示（根据具体业务逻辑灵活调整）
使用上述方法，可以解决“首次切换闪烁”的问题，不过存在两点不足：
1. 图片路径必须使用网络地址（不清楚为啥）；
2. 如果 icon 下需要展示文字描述，会错位，可以考虑将文本和 icon 合并为一个新的 icon 来解决；
下面是使用官方 demo 首次加载后切换的效果：
下面是优化以后的效果：
下面是主要实现代码：
<view class="tab-bar"> <view class="tab-bar-border"></view> <view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab"> <image class="img" src="{{item.selectedIconPath}}" style="{{selected === index？''：'可见性： 隐藏;'}}"></image> <image class="img" src="{{item.iconPath}}" style="{{selected === index？'visibility： hidden;'：''}}"></image> </view> </view>
真NB啊腾讯，状态直接中止了，自家腾讯云小程序都有这个问题，打死不修呗
超过两个tabbar页不要单纯的使用官方说的show时getTabBar().setData设置选中态，自定义tabbar是多个实例的，那样只会改变当前tabbar实例的选中态，其他页面的tabbar实例并没有改变选中态，这样会导致你说的那些问题。
正确做法：
在每个tabbar lifetimes attached时找个地方（比如globalData）存进去，然后在每个tabbar页面show时遍历存的tabbar实例setData 选中态， 因为官方demo只有两个tabbar页，于是只获取当前页的tabbar实例setData不会有问题，官方这个不回复态度就是只管拉屎不管搽屁股。
今天是2023年3月15日（国际消费者权益日），第一次切换依旧还在闪烁。
2023年了这个问题还没解决吗？体验太差了
正在加载...
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
都 2023年中旬了， 官方还没给个答复，也是醉了，，，，，，
都 2021年中旬了， 官方还没给个答复，也是醉了，，，，，，
其实他要是多个页面都用同一个tabbar实例可能就没有这个问题了
现在都2022年了，这么多用户反馈了2年多的问题还解决不了吗，我不相信以腾讯的实力解决不了这个问题，如果个别开发人员解决不了这个问题，腾讯这么多技术大佬能帮忙解决下吗。
2020-11-25发布的问题，今天是2021-07-27，还没解决么，绩效扣光了！
可以将原来放置 image 标签的位置，替换为两个 image 标签，一个存放选中图片路径，一个存放未选中图片路径，然后通过 selected 状态来控制是否展示元素（将不需要展示的元素设置为 visibility: hidden;）。
此时页面会同时渲染所有的 icon 图片，即使不需要展示，也会渲染，因此会有一个透明的占位，此时可以使用 position: absolute 布局来使其重叠展示（根据具体业务逻辑灵活调整）
使用上述方法，可以解决“首次切换闪烁”的问题，不过存在两点不足：
1. 图片路径必须使用网络地址（不清楚为啥）；
2. 如果 icon 下需要展示文字描述，会错位，可以考虑将文本和 icon 合并为一个新的 icon 来解决；
下面是使用官方 demo 首次加载后切换的效果：
下面是优化以后的效果：
下面是主要实现代码：
<view class="tab-bar"> <view class="tab-bar-border"></view> <view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab"> <image class="img" src="{{item.selectedIconPath}}" style="{{selected === index？''：'可见性： 隐藏;'}}"></image> <image class="img" src="{{item.iconPath}}" style="{{selected === index？'visibility： hidden;'：''}}"></image> </view> </view>真NB啊腾讯，状态直接中止了，自家腾讯云小程序都有这个问题，打死不修呗
超过两个tabbar页不要单纯的使用官方说的show时getTabBar().setData设置选中态，自定义tabbar是多个实例的，那样只会改变当前tabbar实例的选中态，其他页面的tabbar实例并没有改变选中态，这样会导致你说的那些问题。
正确做法：
在每个tabbar lifetimes attached时找个地方（比如globalData）存进去，然后在每个tabbar页面show时遍历存的tabbar实例setData 选中态， 因为官方demo只有两个tabbar页，于是只获取当前页的tabbar实例setData不会有问题，官方这个不回复态度就是只管拉屎不管搽屁股。
今天是2023年3月15日（国际消费者权益日），第一次切换依旧还在闪烁。
2023年了这个问题还没解决吗？体验太差了