快速點擊按鈕會重復多次調用接口，防止出現這樣的情況

全局定義，方便調用

新建plugins.js

export default {install (Vue) {// 防重復點擊(指令實現)Vue.directive('preventReClick', {inserted (el, binding) {el.addEventListener('click', () => {if (!el.disabled) {el.disabled = truesetTimeout(() => {el.disabled = false}, binding.value || 3000)}})}})} }

在main.js引用

按鈕調用直接加v-preventReClick

<el-button type="prismary" style="width:100%;" @click="handleSubmit" v-preventReClick></el-button>

親測可用

?

轉載于:https://www.cnblogs.com/adbg/p/11271237.html

總結

以上是生活随笔為你收集整理的vue防重复点击(指令实现)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。