vue全局自定义指令

一、用一个页面放自定义方法

clickStateForm.js 

/**
 * @description 自定义指令v-preventClick 防止重复点击
 */
export default {
    install(Vue) {
        Vue.directive('preventClick', {
            inserted(el, binding) {
                el.addEventListener('click', () => {
                 //这里写自定义指令方法
                    console.log('自定义指令方法')
                        // if (!el.disabled) {
                        //     el.disabled = true
                        //     setTimeout(() => {
                        //         el.disabled = false
                        //     }, 6000)
                        // }
                })
            },
        })
    },
}

二、全局引入

main.js

import preventClick from '@/utils/clickStateForm'
Vue.use(preventClick) 

三、使用

在需要的按钮上加 v-preventClick ，点击按钮就可以调用定义的方法了。

   <el-button 
          v-preventClick 
          type="text"
          @click="handleEdit(row)"
        >
          修改
        </el-button>