Vueでのボタンの複数回のクリック防止

命令をカスタマイズすることで、簡単で便利です.
debounce.js

export default {
    install(Vue) {
        Vue.directive("debounce", {
            // bind              。                ,          
            bind(el) {
                // console.log(el)
            },
            //              
            inserted(el, binding) {
                el.addEventListener('click', function () {
                    let time = binding.value.time;
                    let methods = binding.value.methods;
                    clearTimeout(el.timeId)
                    el.timeId = setTimeout(() => {
                        methods()
                    }, time);

                })
            }
        })
    }
}

main.js

import debounce from "./directive/debounce"

Use:
//入力に必要な時間、および対応するイベント処理関数

export default {
      name: "OrganizationManagement",
      data() {
        return {
          aaa:12
        };
      },
      methods: {
        clickHandle() {
          console.log(this.aaa);
        },
      },
      mounted() {},
};