element-ui-stop-multiple-click

vue-stop-multiple-click

a simple way prevent button multiple clicks.

一个非常简单的方式，防止按钮重复点击。

使用一个指令，像这样 v-click-async="ajaxPromiseFn" 把 Promise 函数传入，程序就能自动防止按钮重复点击了。按钮被点击后，一定要等到异步函数结束，才能再次点击，从而解决了重复点击的问题。

Usage

const StopMultipleClick = require('element-ui-stop-multiple-click')
 
Vue.directive('clickAsync', StopMultipleClick)

<button v-click-async="ajaxPromiseFn">a simple way prevent button multiple clicks</button>

or use CDN script:

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/element-ui-stop-multiple-click@0.0.6/vue-prevent-multiple-click.min.js"></script>
 
<script>
var StopMultipleClick = window.StopMultipleClick
 
Vue.directive('clickAsync', StopMultipleClick)
</script> 
 
<button v-click-async="ajaxPromiseFn">button will auto prevent multiple clicks</button>

example / demo

online example