kd-aiot-frontend-wt/src/directives.js

import Vue from 'vue';

// 定义全局自定义指令
Vue.directive('submit-once', {
  inserted(el, binding) {
    const [fn, ...args] = binding.value;

    console.log(fn, args);

    if (typeof fn !== 'function') {
      console.error('v-submit-once 指令需要传入一个函数');
      return;
    }

    el.addEventListener('click', async () => {
      console.log(el);
      if (el.disabled) return;
      // 禁用按钮并显示加载状态
      el.disabled = true;
      const originalText = el.innerHTML;
      el.innerHTML = '<i class="el-icon-loading"></i> 处理中...';
      try {
        // 调用传入的提交方法
        await fn(...args);
      } catch (error) {
        console.error('提交出错:', error);
      } finally {
        console.log('fn调用完了');
        // 恢复按钮状态
        el.disabled = false;
        el.innerHTML = originalText;
      }
    });
  }
});