相关疑难解决方法(0)

如何突出显示 v-data-table 中的选定行？我试图通过selected在示例中添加标志变量来修改数据

在上面的示例中，单击一行将通过添加名为 primary 的类来突出显示。如果它是静态数据，它工作正常，但如果它是动态数据，如从 API 获取数据，则数据表中的数据将始终刷新，如果我更改分页和排序等等。

例如，在我的情况下，如果我对列进行排序，则数据将来自 API，并且 v-data-table 中的数据将使用排序后的数据进行刷新，在这种情况下，selected每次都很难维护该标志当数据发生变化时。有没有其他方法可以突出显示选定的行？

我正在使用 Vuetify 1.5.x 中的数据表

已启用复选框以便可以选择多行，我希望能够使用 Shift + 单击进行选择，这样我就不必单击与 Gmail 完全相同的每个复选框。

如果我有一个随排序而改变的行 id，或者在对数据表进行排序时对行数组进行了重新排序，这并不难。但这些似乎都不起作用。

有没有人用 vuetify 数据表实现这一点？

    <template v-slot:items="props">
        <tr :active="props.selected" @click="selectRow(props);">
            <td>
                <v-layout>
                    <v-flex>
                        <v-checkbox
                            :input-value="props.selected"
                            primary
                            hide-details
                            :class="{ 'red--text': props.item.was_modified_recently == 1 }"
                        ></v-checkbox>
                    </v-flex>
               </td>
          </tr>
     </template>

Vuetify 文档示例

I am using a v-data-table, with the option "show-select", which shows checkboxes behind every row, but I have no idea how to actually know which rows are checked and get their values...

This is the code

<v-data-table
   :headers="TopicHeaders"
   :items="allTopics"
   :search="searchTopics"
   show-select
   class="elevation-1"
   item-key="name"
></v-data-table>

Thank you