小程序longpress的bug及其解决

我的小程序中,用到一个长按修改的功能,设计是这样的,短按tap,长按longpress

但是,偶尔出现长按无效的情况。我自己都经常碰到,今天仔细研究,用半天时间反复寻找,重现,发现问题和内存或别的因素无关,最有可能是事件引起的。我发现,这种操作下,长按无效会大概率出现:

把列表上拖,使分隔线位于屏幕上沿,手尽量按分割线,这时,不会出现长按后的弹出菜单。再往后,就是长按无效。但tap依然有效。

而且,一般过一段时间,又正常了。

学习文档,发现:

长按原来的事件是longtap,问题就很多,和tap老是冲突,才导致又用这个新事件

longpress的处理是,如果350毫秒内没有处理,将触发tap,否则不触发tap。

加上又是冒泡事件,情况更加复杂。

对于效果,我比较不满意。一方面,要手抬起来后,才触发tap事件,另外长按和tap没有关联,和正常习惯也不一致。我看微信本身的处理是,按在列表上,立刻有点中的响应,再过一小会,弹出菜单。

经过反复试验,找到一个接近微信的解决方案

捕获两个事件,按下事件直接处理选中,并记录timestamp,tap事件处理是否弹出菜单。可能比微信稍晚点(要手起来才出菜单),但也算接近了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏IT大咖说

Redux助力美团点评前端进阶之路

摘要 都说Redux好,但Redux到底好在哪,它真的解决了业务中遇到的问题吗? 因为在业务中引入Redux而带来的额外成本是否让你苦恼过? 会不会是我们打开R...

3404
来自专栏九彩拼盘的叨叨叨

网页PPT: reveal.js 介绍

reveal.js 是一个展示内容的框架,可以简单的理解为网页版的PPT。我们用 reveal.js 做出来的PPT其实是一个HTML文件。

4272
来自专栏贾鹏辉的技术专栏@CrazyCodeBoy

快速创建React Native App

尊重版权,未经授权不得转载 本文出自:贾鹏辉的技术博客(http://www.devio.org) 告诉大家一个好消息,为大家精心准备的React N...

4474
来自专栏葡萄城控件技术团队

ActiveReports 报表应用教程 (2)---清单类报表

在大多报表系统中都有清单类报表的身影,比如:客户清单、商品信息清单、设备清单、物品采购清单、记账凭证、货品发货清单、员工清单等等。清单类报表看视乎比较简单,但是...

2256
来自专栏Jerry的SAP技术分享

给谷歌输入法增添自定义词组,提高输入效率

我在写微信公众号文章时,经常需要重复输入一些名词,比如CRM,C4C,S/4HANA等等。为了减少输入,我在查找一款输入法,能够让我通过少量的输入,就能够快速打...

1221
来自专栏达摩兵的技术空间

touch-action导致安卓页面无法滚动

相信大家搜css touch-action很容易搜到一批文章,但感觉自己还是需要写下自己这这个过程中的一些探索经历。

8690
来自专栏李成熙heyli

性能优化三部曲之二——通用纯前端优化首屏时间

背景: 对构建的改造已经完成,目前构建的能力可以较为灵活地支撑进一步的优化 希望进一步减少首屏时间,将首屏时间控制在2秒以内 页面情况: 优化之前,并没有上报...

3409
来自专栏web前端教室

Redux基本用法,为周日的先行者课程准备着。

众所周知,React只是一个View层而已,它不是一个完整的前端解决方案。只是给出了页面组件化的解决思路,但组件之间如何沟通?代码之间的结构?它并没有给出更多的...

2017
来自专栏编程

vuejs开发H5页面总结

最近参与了APP内嵌H5页面的开发,这次使用vuejs替代了jQuery,仅仅把vuejs当做一个库来使用,效率提高之外代码可读性更强,在此分享一下自己的一些开...

4489
来自专栏DeveWork

为你的WordPress 博客开启两步验证功能(技术支持:谷歌)

如果你有谷歌账号的话,为了安全,最好是开启两步验证功能——即在原来的基础上增加手机验证码这一关。谷歌中涉及到两步验证的技术是Google Authenticat...

6296

扫码关注云+社区

领取腾讯云代金券