javascript - Bootstrap Vue 复选框 : How to check/uncheck checkbox when clicking another element

Question

我读了docs但我找不到任何在单击表格行(当它位于表格下方时)时将 bootstrap vue 复选框设置为选中/取消选中的示例。有没有办法单击一行会导致它被选中/取消选中？

data() {
  return {
    form: {
      optional: {} as { [index: string]: boolean },
    }, 
  };
},
methods: {
  triggerCheckBox(relatedId: string) {
    const val = this.form.optional[relatedId];
    this.form.optional[relatedId] = !val;
  },
}

<tr v-for="related in liability.related" @click="triggerCheckBox(related.id)">
  <td>
    <b-form-checkbox
      v-model="form.optional[related.id]"
    </b-form-checkbox>
  </td>

编辑:我已经操纵了 v-model 绑定(bind)到复选框。还是不行。

Answer 1

我将其添加到我创建的 Hook 的代码中:

this.$set(this.form.optional, related.id, false));

将form.Optional设置为响应式(Reactive)..