在Vue3中，全局使用按钮截流指令的方法与Vue2中有所不同，可以根据以下步骤进行：
1.创建一个自定义指令文件，例如throttle.js，该文件中实现按钮截流逻辑的代码。示例代码如下：
export default {
mounted(el, binding) {
let timeoutId;
const delay = parseInt(binding.value) || 2000; // 获取指令参数，如果没有，则默认为 2000ms
el.addEventListener('click', () => {
if (!el.disabled) {
el.disabled = true;
clearTimeout(timeoutId); // 清除之前的定时器
timeoutId = setTimeout(() => {
el.disabled = false;
}, delay);
}
});
},
};
2.在main.js中全局引入该自定义指令，并将其注册到应用程序中。示例代码如下：
import { createApp } from 'vue';
import App from './App.vue';
import throttle from './directives/throttle';
const app = createApp(App);
app.directive('throttle', throttle);
app.mount('#app');
在上述代码中，app.directive方法用于全局注册自定义指令，将自定义指令注册到Vue应用程序中。通过此方法，可以在整个应用程序中使用该指令，而不需要重复定义或导入指令。
1.在模板中使用该自定义指令。在模板中使用该指令的方法与Vue2中相同，示例如下：
<template>
<div>
<button v-throttle.click="2000">Click Me</button>
</div>
</template>
在上述代码中，v-throttle.click表示注册的自定义指令名称，后面的 .click表示该指令对应原生的click事件，.2000表示传入的参数为2000ms，也可以省略。
需要注意的是，在Vue3中，app.directive方法用于全局注册自定义指令，不再支持在组件实例选项中注册全局指令。因此，如果需要在组件内使用自定义指令，需要在组件内部使用局部自定义指令，并将其作为选项传递给Vue组件实例。
Vue2与Vue3中的自定义指令实现方式略有不同，但实现的按钮截流功能是类似的。
在Vue2中，可以通过以下代码实现按钮截流指令：
// throttle.js
export default {
bind(el, binding) {
let timeoutId;
const delay = parseInt(binding.arg) || 2000;
el.addEventListener('click', () => {
if (!el.disabled) {
el.disabled = true;
clearTimeout(timeoutId);
timeoutId = setTimeout(() => {
el.disabled = false;
}, delay);
}
});
},
};
在Vue2中，自定义指令的钩子函数bind等同于Vue3中的mounted，表示指令绑定到元素上时执行的函数。在上述代码中，指令绑定到按钮的点击事件上，在点击事件发生时，将按钮禁用，并设定一个延时，在延时结束后，将按钮恢复为启用状态。
