Javascript 通过选中vuetify中的另一个复选框禁用复选框

因此，我有几个

复选框

，其中两个应该像

单选按钮

一样工作，这意味着如果我单击一个，另一个应该被禁用，反之亦然（我知道我可以使用

单选按钮

，但我需要使用

复选框

）。最好的方法是什么

以下是这两个

复选框的代码：

<v-checkbox label="Check1" value="Check1" v-model="Check1" ></v-checkbox>

<v-checkbox label="Check2" value="Check2" v-model="Check2" ></v-checkbox>

尝试处理
@change
事件，该事件将更新
检查1
和
检查2
，如下所示：

  <v-checkbox label="Check1" value="Check1" v-model="Check1" @change="Check2=!Check1"></v-checkbox>

   <v-checkbox label="Check2" value="Check2" v-model="Check2" @change="Check1=!Check2"></v-checkbox>



您可以检查此项
您的两个值不是相互独立的；一个定义另一个。因此，您应该只有一个
数据
项，另一个可以是可设置的计算项

  data: {
    Check1: true
  },
  computed: {
    Check2: {
      get() {
        return !this.Check1;
      },
      set(newValue) {
        this.Check1 = !newValue;
      }
    }
  }

如果您确实希望它们不完全链接，比如说您希望能够同时关闭它们，那么您可以制作两个
数据
项，并在每个项上设置一个
监视
，在打开此项时关闭另一项

  data: {
    Check1: true,
    Check2: false
  },
  watch: {
    Check1(nv) { if (nv) { this.Check2 = false; } },
    Check2(nv) { if (nv) { this.Check1 = false; } }
  }