Vue 按钮单次点击实现：禁用重复点击

可以通过在点击事件中添加一个状态来实现按钮只能点击一次的效果。具体步骤如下：

1. 在 data 中定义一个变量，用于保存按钮的点击状态：

data() {
  return {
    isClicked: false
  }
}

2. 在按钮的点击事件中，先判断 isClicked 的值是否为 false，如果是，则执行点击事件，并将 isClicked 的值设为 true；如果不是，则不执行点击事件。

<button @click='handleClick' :disabled='isClicked'>点击按钮</button>

methods: {
  handleClick() {
    if (!this.isClicked) {
      // 执行点击事件
      console.log('按钮被点击了');
      // 将 isClicked 的值设为 true，禁止再次点击
      this.isClicked = true;
    }
  }
}

3. 可以通过给按钮添加一个属性 disabled，来禁止按钮再次被点击。在上面的代码中，当 isClicked 的值为 true 时，按钮的 disabled 属性的值也为 true，从而禁止了按钮的再次点击。