然后点击了“我的”“首页”等等 tabbar item，来回点击几次，midButton的图片
q***@gmail.com
- 发布：2024-06-02 16:32
- 更新：2024-09-07 13:39
- 阅读：219
产品分类： uniapp/H5
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 14.5 (23F79)
HBuilderX类型： 正式
HBuilderX版本号： 4.15
浏览器平台： Chrome
浏览器版本： 版本 125.0.6422.113（正式版本） (arm64)
项目创建方式： HBuilderX
操作步骤：
预期结果：
midButton的图片路径不要变化
midButton的图片路径不要变化
实际结果：
midButton的图片异常
midButton的图片异常
bug描述：
tabbar 在 h5 环境下在反复点击不同的 item 后，midButton 图片显示错误。
一开始的配置是这样的，显示是正常的。
"midButton": {
"iconPath": "static/tabbar/mid.png",
"width": "80px",
"height": "90px",
"iconWidth": "80px"
}此时通过 Chrome 的检查元素看到midButton节点如下：
<img src="static/tabbar/mid.png" style="width: 80px; height: 80px;">
然后点击了“我的”“首页”等等 tabbar item，来回点击几次，midButton的图片就显示异常。此时的midButton节点如下：
<img src="/pages/mine/static/tabbar/mid.png" style="width: 80px; height: 80px;">
图片的路径被改动了，前面自动加上了 /pages/mine 前缀，如果切换到 home 就变成了 /pages/home 前缀。导致读取错误的路径，图片显示异常
4 个回复
喜欢技术的前端 - QQ---445849201
试了，没发现，你试试附件的demo
q***@gmail.com (作者)
@喜欢技术的前端 你这个确实没问题，但是我的还是有问题。我提交代码给你看看
喜欢技术的前端
是有点问题，vue3 下会出问题，可以先改成
2024-06-02 17:40
q***@gmail.com (作者)
回复 喜欢技术的前端: 嗯，我想要的是不要离底太近，只是搞不懂怎么会引发图片路径变化。这个值应该固定才对的
2024-06-02 17:45
喜欢技术的前端
回复 q***@gmail.com: 是的，之前没遇到过，也可以让UI小伙伴，给底下切写透明边也是个办法
2024-06-02 17:48
q***@gmail.com (作者)
回复 喜欢技术的前端: 嗯，bug 能修复就好，其他都是曲线救国的临时方案。有点麻烦的。
2024-06-02 17:56
1***@163.com
解决了吗，我也遇到这个问题Vue3
will0523
同问，我也遇到了