elementui中@click短时间内多次触发，@click重复点击，做不允许重复点击处理

在Element UI中，可以通过在方法中添加逻辑来避免重复点击。这里提供一个简单的示例，使用一个变量来跟踪按钮的点击状态，并在特定的时间内阻止重复点击。

<template>
  <el-button :disabled="isClicked" @click="handleClick">点击我</el-button>
</template>
 
<script>
export default {
  data() {
    return {
      isClicked: false, // 控制按钮是否禁用
      clickTimer: null // 计时器
    };
  },
  methods: {
    handleClick() {
      if (this.clickTimer) {
        clearTimeout(this.clickTimer); // 清除之前的计时器
      }
 
      this.isClicked = true; // 设置按钮为禁用状态
 
      // 模拟一个异步操作，比如网络请求
      setTimeout(() => {
        // 操作完成后重新启用按钮
        this.isClicked = false;
      }, 3000); // 假设操作需要3秒钟
 
      // 设置计时器，防止在操作完成前重复点击
      this.clickTimer = setTimeout(() => {
        this.clickTimer = null;
      }, 3000); // 计时器时间应与异步操作时间对齐
    }
  }
};
</script>

在这个例子中，我们使用了setTimeout来模拟异步操作。在操作完成前，按钮会被禁用，并且设置了一个计时器来防止在操作完成前的重复点击。当计时器结束时，按钮将重新启用。这种方法确保用户在短时间内无法进行多次点击，从而防止了重复提交。