Question

我在使复选框正常工作时遇到问题。为“选定”插槽中的每一行呈现的复选框未绑定到正确的行。当您单击该复选框时，它会将最上面几行的复选框设置为true / false。

问题： 1）如何将该行的复选框的真/假状态绑定到其行项目？我试图将其绑定到data.item.selected，然后遍历数据以查找“ selected”对象并执行必要的操作。我什至尝试将行对象添加到新的数据数组中，但只添加了顶部行？

2）根据HEAD_selected插槽复选框将所有行复选框的是/否变成最佳的方法是什么？

代码：

<b-table 
  striped 
  hover 
  outlined 
  :items="schools" 
  :fields="fields"
  :per-page="perPage"
  :current-page="currentPage"
  :total-rows="totalRows"
  :sort-by.sync="sortBy"
  :sort-desc.sync="sortDesc">

  <template slot="HEAD_selected" slot-scope="data">
    <b-form-checkbox @click.native.stop v-model="allSelected">
    </b-form-checkbox>
  </template>

  //Not working. data.item.selected is always the top row in all of the results, not it's current position
  <template slot="selected" slot-scope="data">
    <b-form-checkbox id="checkbox" @click.stop v-model="data.item.selected">
    </b-form-checkbox>
  </template>

</b-table>

Answer 1

答案：

问题是b-form-checkbox中的ID。 id =“ checkbox”已绑定到同一复选框。一旦将其更改为：id =“'checkbox'+ data.index”，它就会起作用！

B表中复选框的自举问题

1 个答案: