<div class="relative cover-area" id="cover-area" :style="{ width: form.width, height: form.height }"
@touchmove="onTouchMove"
@touchstart="onTouchStart" @touchend="onTouchEnd">
<image :src="form.cover" :style="{ width: form.width, height: form.height }" />
<div :style="{ top: addTagBtnRect.handleTop, left: addTagBtnRect.handleLeft }"
class="flex-row flex-center add-tag bg-color-f6f6f6" @click="onTagClick" @touchstart.stop="onddd($event)" @touchmove.stop @touchend.stop>
<g-icon type="plus" size="30" bold color="#333" />
</div>
</div>
view>
- 发布:2023-03-11 18:07
- 更新:2023-03-11 20:49
- 阅读:447
产品分类: uniapp/App
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: win11
HBuilderX类型: 正式
HBuilderX版本号: 3.7.3
手机系统: Android
手机系统版本号: Android 12
手机厂商: 小米
手机机型: 小米13
页面类型: nvue
vue版本: vue3
打包方式: 云端
项目创建方式: HBuilderX
示例代码:
操作步骤:
同代码示例
同代码示例
预期结果:
图片的touchstart
等触摸事件不再执行。
图片的touchstart
等触摸事件不再执行。
实际结果:
还是执行
还是执行
bug描述:
心累,一个坑踩完又来另外一个坑,写个页面写一天。
我只是简单的想给图片做一个点击添加 标记 的需求,用户点哪里,就在哪个位置添加一个标记,结果哎嘿,发现click
拿不到点击的坐标。
行,我搜问答社区,搜百度,尝试将click
换成tap
,尝试将view
换成div
,div
的 Event 信息要比view
丰富,但是也没有我要的坐标信息。
我接着尝试了一下touchstart
,可以,里面有我想要的坐标,于是我通过touchstart
、touchmove
、touchend
三个事件来模拟了click
,嘿嘿,就很开心,终于好了。
想多了,还有问题,我不想让用户点击标记还执行图片上的touchstart
(标记是在图片元素内部的,所以会有事件冒泡),我以为简单的加个.stop
就完了,几秒钟就行,结果啊结果,发现不生效,于是又各种搜,还是不行,我绝望了。
而且社区有关于这个冒泡问题的反馈,没看到几个官方人员的回答,请问你们能不能把这些基本的问题修复一下,再去搞一些什么新特性?
1 个回复
曾小晨 (作者)
折腾了一下,通过
click
和touchstart
两者来实现了我所需要的功能,touchstart
只作为收集坐标