uni-app 鸿蒙系统双指长按识别后 picker-view 基础组件无法滚动
uni-app 鸿蒙系统双指长按识别后 picker-view 基础组件无法滚动
项目属性 | 信息 |
---|---|
产品分类 | uniapp/App |
PC开发环境操作系统 | Mac |
PC开发环境操作系统版本号 | macOS Sonoma 14.6.1 |
HBuilderX类型 | 正式 |
HBuilderX版本号 | 4.24 |
手机系统 | 全部 |
手机厂商 | 华为 |
页面类型 | vue |
vue版本 | vue2 |
打包方式 | 云端 |
项目创建方式 | HBuilderX |
测试过的手机:
harmonyOS 4.2.0.136
操作步骤:
- 鸿蒙系统,双指长按,识别,关闭识别蒙层,再次滑动picker,无法进行滑动
预期结果:
- 鸿蒙系统,双指长按,识别,关闭识别蒙层,可以进行正常的滑动选择
实际结果:
- 无法滑动选择
bug描述:
- 鸿蒙系统,双指长按识别,识别后,picker-view 基础组件无法滚动
更多关于uni-app 鸿蒙系统双指长按识别后 picker-view 基础组件无法滚动的实战教程也可以访问 https://www.itying.com/category-93-b0.html
你这种情况是只有picer-view不能点,其它位置可以点吗?
更多关于uni-app 鸿蒙系统双指长按识别后 picker-view 基础组件无法滚动的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
可以的,点击事件没有问题,只有滚动事件会有问题。看了源码,使用的是onWheel 滚轮事件,不知是否Wheel 事件被识别的时候重置了
回复 m***@gmail.com: 暂时不清楚这个的影响
在处理uni-app在鸿蒙系统上双指长按识别后picker-view
基础组件无法滚动的问题时,我们首先需要明确问题发生的上下文和可能的解决方案。由于这个问题涉及到特定平台(鸿蒙系统)和特定手势(双指长按),解决起来可能较为复杂。不过,我们可以尝试通过一些编程技巧来绕过这个问题,或者确保在特定手势下组件的行为符合预期。
以下是一个基本的示例代码,展示了如何在uni-app中使用picker-view
组件,并尝试处理可能的手势冲突。请注意,由于鸿蒙系统的特殊性,以下代码可能需要根据实际情况进行调整。
<template>
<view class="container">
<picker-view :value="pickerValue" @change="onPickerChange">
<picker-view-column>
<view v-for="item in columns[0]" :key="item">{{ item }}</view>
</picker-view-column>
<!-- 根据需要添加更多列 -->
</picker-view>
</view>
</template>
<script>
export default {
data() {
return {
pickerValue: [0], // 初始选中的值
columns: [
['选项1', '选项2', '选项3', '选项4'] // 选项数据
// 根据需要添加更多列数据
]
};
},
methods: {
onPickerChange(e) {
this.pickerValue = e.detail.value;
console.log('选中的值:', this.pickerValue);
}
},
mounted() {
// 尝试监听触摸事件来处理双指长按
const handleTouch = (e) => {
if (e.touches.length === 2 && e.type === 'touchstart') {
// 双指长按处理逻辑,这里可以阻止默认行为或者进行其他处理
// 例如,重置picker-view的滚动状态,或者暂时禁用滚动
console.log('双指长按识别');
// 可能的解决方案:重置picker-view的滚动位置
// this.pickerValue = [初始位置]; // 根据需要设置
}
};
// 注意:这里直接监听document可能不适用于所有情况,需要根据实际情况调整选择器
document.addEventListener('touchstart', handleTouch);
document.addEventListener('touchmove', handleTouch);
document.addEventListener('touchend', handleTouch);
},
beforeDestroy() {
// 移除事件监听器
document.removeEventListener('touchstart', this.handleTouch);
document.removeEventListener('touchmove', this.handleTouch);
document.removeEventListener('touchend', this.handleTouch);
}
};
</script>
在上述代码中,我们尝试通过监听全局的触摸事件来识别双指长按手势,并在识别到该手势时执行特定的处理逻辑。然而,由于鸿蒙系统的差异性和手势识别的复杂性,这种方法可能无法完全解决问题。在实际应用中,可能还需要结合鸿蒙系统的特定API或事件机制来进行更深入的优化和处理。