长按按钮,有时候touchend 事件不触发
s***@outlook.com
- 发布：2023-08-22 19:04
- 更新：2023-12-19 14:49
- 阅读：401
产品分类： uniapp/H5
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 1731.140.2.0.0 (iBridge: 19.16.16066.0.0,0)
浏览器平台： Safari
浏览器版本： 15.6.1
项目创建方式： CLI
CLI版本号： 3.0.0-alpha-3081120230719001
App下载地址或H5⽹址： https://sta9-stage.acat.ai/pages/chatRecord/index?game=20
操作步骤：
预期结果：
松开以后触发 touchend 事件
松开以后触发 touchend 事件
实际结果：
touchend 有时候会不触发,频率较高
touchend 有时候会不触发,频率较高
bug描述：
<button
@touchstart="longpress"
@touchcancel="cancel"
@touchend="cancel"
class="btn bg-transparent"
:class="[
recording
? 'ballon relative transform-gpu bg-[linear-gradient(0deg,#ffffff_0%,#ffe778_50%,_#ffffff_100%)] p-0.5 drop-shadow-[0_0px_5px_#FFE778] rem:h-[112px] rem:w-[310px] rem:rounded-[56px]'
: ''
]"
>
<view
:class="[recording ? 'transform-gpu cursor-pointer drop-shadow-[0_0px_5px_#FFFFFF]' : '']"
class="flex items-center justify-center bg-[#000000] rem:h-[112px] rem:w-[310px] rem:rounded-[56px]"
>
<image
v-if="!recording"
class="rem:h-[70px] rem:w-[50px]"
src="@/asstes/img/chat/audio.png"
mode="scaleToFill"
lazy-load="false"
/>
<image
v-else
class="rem:h-[70px] rem:w-[50px]"
mode="scaleToFill"
lazy-load="false"
src="@/asstes/img/chat/audio_active.png"
/>
<text class="text-white"></text>
</view>
<view v-if="recording" class="circle"></view>
<view v-if="recording" class="circle"></view>
<view v-if="recording" class="circle"></view>
</button>
2 个回复
Diligent_UI - 【插件开发】【专治疑难杂症】【多款插件已上架：https://ext.dcloud.net.cn/publisher?id=193663(微信搜索飘逸科技UI小程序直接体验)】【骗子请绕道】问题咨询请加QQ群：120594820，代表作灵感实用工具小程序
从文档来看，这些鼠标事件好像都没有写，用css伪类试试实现需求
叫啥好呢
解决了吗？