Vue.js - 设置动态复选框值真/假

Question

我有一个包含一些产品列表的表格，现在每个产品都有一个上传文件和一个完整的复选框，

<vs-table :data="fileUpload">
   <template slot="header">
      <h3>
         Upload Files
      </h3>
   </template>
   <template slot="thead">
      <vs-th>
         Data
      </vs-th>
      <vs-th>
         Upload Files
      </vs-th>
      <vs-th>
         Uploaded
      </vs-th>
   </template>
   <template slot-scope="{ data }">
      <vs-tr :key="indextr" v-for="(tr, indextr) in data">
         <!--<vs-tr>-->
         <vs-td>
            {{tr}}
         </vs-td>
         <vs-td>
            <div class="centerx">
               <input type="file" v-on:change="handleFileUpload($event,indextr)" />
            </div>
         </vs-td>
         <vs-td>
            <vs-checkbox v-model="completedCheckboxes" :vs-value="indextr"></vs-checkbox>
         </vs-td>
      </vs-tr>
   </template>
</vs-table>

现在关于 handleFileUpload 的更改事件，我想将其旁边的复选框设置为 true。

handleFileUpload: async function(event,checkboxIndex) {
//set checkbox for that row here
}

 data() {
    return {
    completedCheckboxes:[],
 }
}

现在我确实得到了 completedCheckboxes 数组中的 checboxes 值p>

Answer 1

由于复选框是索引尝试将上传的文件索引推送到completedCheckboxes 数组：

handleFileUpload: async function(event,checkboxIndex) {
    this.completedCheckboxes.push(checkboxIndex)
}