在项目中，需要对操作按钮加以限制，来防止用户多次连续点击。这就需要用到自定义指令directive。

main.js中全局注册方法如下：

const app = createApp(App);
/**
 @方法名：directive(app.directive,vue3内置api)
 @参数：
 @描述：用于防止多次点击保存效果，仅用于button
**/
app.directive('preventReClick', (el, binding) => {
  	function preventReClickFun(elValue, bindingValue) {
	    if (!elValue.disabled) {
	      	elValue.disabled = true
	      	setTimeout(() => {
	        	elValue.disabled = false
	      	}, bindingValue.value || 3000)
	    }
  	}
  	el.addEventListener('click', () => preventReClickFun(el, binding))
  	binding.dir.unmounted = function() {
    	el.removeEventListener('click', () => preventReClickFun(el, binding))
  	}
});

使用：

<el-button type="primary" @click="handleClick" v-preventReClick></el-button>