vant/vue手机端长按事件以及禁止长按弹出菜单实现方法详解
更新时间：2022年12月24日 13:36:41 作者：Nanchen_42
这篇文章主要介绍了vant/vue手机端长按事件以及禁止长按弹出菜单实现方法详解,需要的朋友可以参考下
vant/vue实现手机端长按事件
先给两个事件
@touchstart="start"
@touchend="end"
因为vue里的touchend没有封装，所以需要我们自己去写
方法如下：
start() {
clearTimeout(this.loop); //再次清空定时器，防止重复注册定时器
this.loop = setTimeout(() => {
console.log("长按了");
}, 1000);
},
end() {
clearTimeout(this.loop); //清空定时器，防止重复注册定时器
},
之后发现长按后出现弹出菜单的现象，所以这里要解决一下如何去禁用弹出的菜单
vant/vue实现禁止长按弹出菜单
找到对应需要禁用菜单的页面
* {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
} document.oncontextmenu = function (e) {
e.preventDefault();
};
如果是想要停止冒泡，对需要停止冒泡的元素使用onclick.stop即可
以上就是vant/vue手机端长按事件以及禁止长按弹出菜单实现方法详解的详细内容，更多关于vant/vue手机端长按事件以及禁止长按弹出菜单的资料请关注脚本之家其它相关文章！
相关文章
这篇文章主要介绍了vue中activated的用法，帮助大家更好的理解和使用vue框架，感兴趣的朋友可以了解下2021-01-01
这篇文章主要介绍了Vue如何配置根目录@(引用路径)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
本文主要介绍了Vue极简生成器 Vuepress的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧<BR>2022-06-06
这篇文章主要介绍了Vue.js 中的条件渲染指令，Vue.js 中的条件渲染指令可以根据表达式的值，来决定在 DOM 中是渲染还是销毁元素或组件。本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下2018-11-11
这篇文章主要介绍了vue项目中使用vue-layer弹框插件的方法，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-03-03
这篇文章主要介绍了vue-cli3中如何打包成zip压缩文件，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
这篇文章主要介绍了vue如何判断dom的class,vue点击给dom添加class然后获取含有class的dom文件，具体内容详情大家参考下本文2018-04-04
vue中$nexttick,$set,$forceupdate的区别
本文主要介绍了vue中$nexttick,$set,$forceupdate的区别，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
本篇文章主要介绍了Vue 单文件中的数据传递示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-03-03
这篇文章主要介绍了vue输入框使用模糊搜索功能，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-05-05
最新评论