Quasar:为什么QCheckbox在QTable中全部被选中?

Question

我只检查了一个checkbox，但也检查了所有其他checkboxs。似乎所有的checkbox都有相同的index或id，然而，没有办法解决这个问题。我已经用谷歌搜索过了，但是找不到我要找的路。

这是我写的代码

QTable

<q-table
id="selection-table"
:title="undefined"
:data="curData"
:columns="columns"
@request="updateTableData"
:rows-per-page-options="[10, 20, 30, 40, 50]"
:pagination.sync="pagination"
:loading="isLoading"
row-key="name"
class="no-shadow q-pa-none"
selection="multiple"
:selected.sync="selected"
:selected-rows-label="getSelectedString"
>
<template v-slot:body="props">
<q-tr :props="props" class="q-pa-none">
<q-td>
<q-checkbox v-model="props.selected" />
{{ props }}
</q-td>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
class="q-pa-none"
row-key="name"
:auto-width="col.name == 'title' ? false : true"
>
<span v-if="col.name === 'title'">
{{ props.row.title }}
</span>
<span v-else-if="col.name === 'status'">
<span v-if="col.value === 0">... </span>
<span
v-else-if="
col.value === 200 && props.goodsStatusCode === 11
"
>...</span
>
<span v-else>
<span class="text-red">...)</span>
</span>
</span>
<span v-else> {{ col.value }} </span>
</q-td>
</q-tr>
</template>
</q-table>

脚本

<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
name: 'SelectionTable',
data() {
return {
selected: [],
};
},
methods: {
getSelectedString() {
return this.selected.length === 0
? ''
: `${this.selected.length} record${
this.selected.length > 1 ? 's' : ''
} `;
},
},
});
</script>

你能告诉我我错过了什么吗?

Answer 1

万一有人需要这个，我已经弄清楚了缺少什么。

我需要修改的是:

row-key="name"

row-key="_id"

因为字面上row-key表示我选择的行的key或id。

希望这能帮助像我这样的人!