详细问题描述
(DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题)
[内容] 在VUE页面 scroll-view 里面的元素组件使用长按事件,会和scroll-view的滑动冲突。
重现步骤
[步骤]
大概代码
<scroll-view scroll-y="true" :style="{ height: computedconfigtopHeightPx + 'px', width: computedscreenWidthRpx + 'rpx' }" :show-scrollbar="false">
<!-- 列表内的元素 自定义组件-->
<config-hang
v-for="(value, index) in ServeSceneData"
:key="index"
@click.native="xiuGaiSceneBtnHandle(value)"
@longpress.native="oneSceneRightClickBtnHandle(value, index)"
>
</config-hang>
</scroll-view>
代码如上,很简单就是一个scroll-view 包了一组自定义的列表元素,列表元素有长按事件。
[结果]这时候滑动列表 会触发当前手指下面元素的长按事件。(目前测试只有VUE页面使用scroll-view 包裹时有这个问题,NVUE不会出现,VUE使用页面级滚动也不会有问题)
[期望] 可以在scroll-view 包裹时 滑动列表的时候不触发长按事件
[如果语言难以表述清晰,拍一个视频或截图,有图有真相]
IDE运行环境说明
[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]
[IDE版本号] HBuilderX 2.6.5
[windows版本号]
[mac版本号]
uni-app运行环境说明
[运行端是h5或app或某个小程序?] app
[运行端版本号]
[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]
HBuilderX创建
[编译模式说明:自定义组件模式?纯nvue模式?v3模式?]
v3模式
App运行环境说明
[Android版本号] 随便
[iOS版本号]随便
[手机型号]随便
[模拟器型号]随便
附件
[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]
[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]
[App安装包或H5地址]
[可重现代码片段]
联系方式
[QQ]
3 个回复
小旺仔
给里面的子项添加@touchstart、@touchmove和@longpress事件
itemTouchSatrt(e) {
this.isMove = false
this.touchStartX = e.touches[0].clientX
this.touchStartY = e.touches[0].clientY
},
itemTouchMove(e) {
let delX = e.touches[0].clientX - this.touchStartX
let delY = e.touches[0].clientY - this.touchStartY
if (Math.abs(delX) > 5 || Math.abs(delY) > 5) {
this.isMove = true
}
},
longPress(item) {
if (!this.isMove) {
//你的长按操作
}
},
DCloud_uniCloud_WYQ
快速滑动缓慢滑动都会触发longpress吗?最好整理一个简单的demo发上来
3***@qq.com (作者)
快速和缓慢都会有,我现在已经该成NVUE页面了。暂时没有这个问题了。
2020-04-07 11:50
l***@gmail.com
遇到相同问题,scroll-view做的item项中如果包含长按事件,只要滑动就会触发长按事件,基本没法用
2020-04-08 08:43
DCloud_uniCloud_WYQ
回复 l***@gmail.com: 请上传一份简单的能复现问题的demo,目前长按的逻辑是横竖向350ms内移动距离均不超过10像素
2020-04-08 10:59
1***@189.cn - Game over.
参照 解决方法
我的方法是:
够详细了吧!