vue 防止表单重复提交

在plugins文件夹新建directives.js文件

import Vue from 'vue'const preventReClick = Vue.directive('preventReClick', {inserted: function(el, binding) {el.addEventListener('click', () => {if (!el.disabled) {el.disabled = truesetTimeout(() => {el.disabled = false}, binding.value || 3000) // 传入绑定值就使用，默认3000毫秒内不可重复触发}})}})export default { preventReClick }

在main.js文件中全局引入

import preventReClick from './plugins/directives.js'Vue.use(preventReClick)

使用方法

// v-preventReClick默认为3000 ，也可以设置<button class="btn-rgt" v-preventReClick= "1000" @click="goPay(3)">同意</button>