kd-aiot-frontend-mes/src/utils/clickOnce.js

export default {
  bind(el, binding, vnode) {
    // 创建加载指示器元素
    const loadingIndicator = document.createElement('i');
    loadingIndicator.classList.add('loading-indicator', 'el-icon-loading'); // 假设使用 Element UI 的加载图标
    el.appendChild(loadingIndicator);

    // 隐藏加载指示器，默认不显示
    loadingIndicator.style.display = 'none';

    // 保存加载指示器引用
    el._loadingIndicator = loadingIndicator;

    // 添加点击事件监听器
    el.addEventListener('click', () => {
      // 显示加载指示器
      loadingIndicator.style.display = 'inline-block';

      // 禁用按钮
      el.setAttribute('disabled', '');

      // 假设这里有一个异步操作，完成后需要隐藏加载指示器和重新启用按钮
      setTimeout(() => {
        loadingIndicator.style.display = 'none';
        el.removeAttribute('disabled'); // 重新启用按钮
      }, 2000); // 模拟异步操作耗时2秒
    });

    // 清理事件监听器，防止内存泄漏
    vnode.context.$once('hook:beforeDestroy', () => {
      el.removeEventListener('click', () => {});
      el.removeChild(loadingIndicator);
    });
  }
};