Question

我想要一个引导表，并且已经添加了输入复选框以选择它们以及一个过滤器来获取所有选中的项目（完全没问题）。

选择一行后，数据集属性＆＃34;选择＆＃34;应该设置为1或true。

但是我希望在我过滤时保留所有选定的值（这应该已经通过在我的数据集中保留＆＃34;选择的＃34;属性来解决？）

目前我可以勾选复选框，复选框值本身也会改变，但即使我使用v-model for row.value（2-way-databinding），row.value变量也保持不变

因此。 如何更改引导程序表中属性的值？

<b-table show-empty
             stacked="md"
             :items="items"
             :fields="fields"
             :current-page="currentPage"
             :per-page="perPage"
             :filter="filter"
             :sort-by.sync="sortBy"
             :sort-desc.sync="sortDesc"
             @filtered="onFiltered"
    >

      <template slot="selected" slot-scope="row">
       <input type="checkbox" id="checkbox" v-model="row.value">
        {{row.value}}
      </template>


      <template slot="name" slot-scope="row">{{row.value}}</template>
      <template slot="sapNumber" slot-scope="row">{{row.value}}</template>
      <template slot="createDate" slot-scope="row">{{ moment(row.value).format('dd DD.MM.YY, hh:mm:ss')}}</template>
      <template slot="master" slot-scope="row">
        <!-- We use @click.stop here to prevent a 'row-clicked' event from also happening -->
        <b-button size="sm" @click.stop="info(row.item, row.index, $event.target)" class="mr-1">
          Info modal
        </b-button>
        <b-button size="sm" @click.stop="row.toggleDetails">
          {{ row.detailsShowing ? 'Hide' : 'Show' }} Details
        </b-button>
      </template>
      <template slot="row-details" slot-scope="row">
        <b-card>
          <ul>
            <li v-for="(value, key) in row.item" :key="key">{{ key }}: {{ value}}</li>
          </ul>
        </b-card>
      </template>
    </b-table>

Answer 1

解决方案非常简单。只需更改此部分

<template slot="selected" slot-scope="row">
    <input type="checkbox" id="checkbox" v-model="row.value">
        {{row.value}}
</template>

到这个

 <template slot="selected" slot-scope="data">
     <input type="checkbox" id="checkbox" v-model="data.item.selected">
 </template>

因此，此列的范围不会影响迭代器数据集（在我的情况下是＆＃34; row＆＃34;），而是影响数据属性的根数据集。

如何使引导表行可选并保留过滤器上的选定行？

1 个答案: