javascript - 创建选择表上所有复选框的最佳方法

Question

我是 VueJS 的新手，我正在创建一个数据表组件，到目前为止我已经创建了两个组件:ui-datatable 和 ui-checkbox，允许我检查表中的所有行。工作完美，但我认为必须有一些更聪明的方法来做到这一点。这是我的JSFiddle ，我接受建议，我感觉我的代码多跑了几圈。

Answer 1

您的复选框组件似乎使事情变得更复杂而不是更简单。我只是输入常规复选框:

        <input type="checkbox" v-model="selectAll" />

和

        <input type="checkbox" v-model="selected" :value="row.id" />

然后我修改了 selectAll 的 setter 以使用 value 而不是 value.checked 并重新表述了公式(对性能没有影响 - 我认为你的技术很好):

  set: function (value) {
    this.selected = value ? this.rows.map((row) => row.id.toString()) : [];
  }

Updated fiddle