点击上方“青年码农”关注回复“源码”可获取各种资料使用
Vue
框架开发项目中，遇到个问题，就是在用户提交数据时，如果连续多次
点击按钮
，会
触发
多次，导致数据异常，因此需要限制用户短时间内多次点击同一按钮，只
触发
一次
。1. 自定义指令利用元素的 disabled 属性，新建自定义指令，prevent
Click
.js1exportdefault{
2install(...
在页面中为一个元素绑定
事件
，
事件
执行后页面未刷新且元素还在，然后你再次点击，元素又被绑定个
一次
点击
事件
，这样第二次点击就会执行两次，以此类推。
为解决上述问题，可采用下面"one"方法
2. $(".choose").one("
click
", function () {});-只绑定
一次
事件
如何解决累加绑定： 使用jquery的one()方法，为元素绑定一个
一次
性的
事件
问题分析：
想要在一定时间内，
事件
回调函数仅执行
一次
，需要在外部做一个计时器变量。当进入
事件
的回调函数时，启动这个计时器，倒计时N秒后，计时器自动关闭。
每次进入
事件
回调函数的时候都要判断这个计时器是否为启动状态，如果是启动状态，直接跳出不执行
事件
即可。
解决方案：
举例如下：
HTML代码：
<button>这是一个按钮</button>
jQuery代码：
$(".f_avatar").
click
(function(){
alert('俺是一个小弹框')；
$(this).unbind("
click
"); ---》这句代码就是防止第二次点击生效
</script>
我也是从别处学来的，更多方法请参考：https://www.cnblogs.com/...
Vue
中的
事件
修饰符：1、prevent:阻止默认
事件
；2、stop:阻止
事件
冒泡；3、once：
事件
只
触发
一次
；4、capture：使用
事件
的捕获模式；5、self：只有event.target是当前操作的元素时才
触发
事件
；（只有和当前
事件
触发
的标签一致时才会
触发
）6、passive：
事件
的默认行为立即执行，无需等待
事件
回调执行完毕点完之后不会发生默认
事件
点完超链接不会发生跳转，因为prevent阻止了a标签的默认
事件
（跳转）div和button都有show
事件
，当
点击按钮
时，button会
触发
sh
其实v-on后面跟的不止是
click
事件
也可以是其他的
事件
，用法均相似。比如：v-on:
click
/mouseout/mouseover/mousedown.......
以下
click
为例
注意：所有的v-on都可以简写为@，比如说v-
click
可以简写为@
click
1.监听
事件
可以用v-on指令监听
DOM
事件
，并在
触发
时运行一些 JavaScript 代码。通常来讲就是
