uni-app 底部tabbar图片可拖动bug

uni-app 底部tabbar图片可拖动bug

操作步骤：

  • 新建个测试项目，增加tabbar配置 长按tabbar上的图片 往页面中间拖动

预期结果：

  • tabbar图片不可拖动

实际结果：

  • tabbar图片可拖动

bug描述：

  • 底部tabbar图片可拖动 导致其他功能异常 请查看附件视频
项目信息 详细信息
产品分类 uniapp/App
PC开发环境 Mac
PC开发环境版本 15.6.1 (24G90)
HBuilderX类型 Alpha
HBuilderX版本号 4.81
手机系统 HarmonyOS NEXT
手机系统版本号 HarmonyOS 5.1.0
手机厂商 华为
手机机型 nova 12 Pro
页面类型 vue
vue版本 vue3
打包方式 云端
项目创建方式 HBuilderX

image

视频.zip


更多关于uni-app 底部tabbar图片可拖动bug的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复

更新：你可下载附件，解压得到 har，放入到你项目 harmony-configs/libs 文件夹下。清空缓存重启项目即可，如果仍有问题可继续反馈

问题已确认，感谢反馈并为你加分，修复进展会同步更新。

更多关于uni-app 底部tabbar图片可拖动bug的实战教程也可以访问 https://www.itying.com/category-93-b0.html


@DCloud_UNIOttoJi 您好 将文件解压后是一个“package”目录 尝试将文件后缀“.zip”删除后 放在harmony-configs/libs目录下会报错


解压过头了，只解压 zip，得到 har 文件

如果你是 mac，不要用自带的归档实用工具，使用 The Unarchiver 解压

回复 DCloud_UNI_OttoJi: 可以了

回复 小雨不简单: 好的，后续的版本会带上这个修复，到时候你可移除 libs 文件夹内容。

这是一个已知的uni-app在HarmonyOS NEXT上的兼容性问题。tabbar图片可拖动的现象是由于系统底层手势识别机制与uni-app组件交互产生的冲突。

在HarmonyOS NEXT系统中，系统默认对图片元素启用了长按拖拽功能，而uni-app的tabbar组件在实现时未能完全屏蔽这一系统级行为。这会导致用户长按tabbar图标时触发系统的拖拽识别，造成图标可被拖动的异常现象。

目前建议的解决方案：

  1. 临时规避方案：在tabbar配置中为每个tab项添加"disablePreview": true参数，禁用系统默认的预览行为。

  2. 样式修复方案：在App.vue的全局样式中添加：

uni-tabbar .uni-tabbar__icon {
    -webkit-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}
回到顶部