Primevue数据表在多模式下以编程方式选择行

Question

我使用带有多个选择复选框的PrimeVue数据表。我需要实现向表中添加新行的选项，然后在添加后自动选择它。

我的问题是，将附加值推送到选定的行数组并不是选择它

模板：

<DataTable :rows="10" :value="items" v-model:selection="selectedRows" dataKey="id"
responsiveLayout="scroll" v-model:filters="filters" @rowSelect="onRowSelect"
@rowUnselect="onRowUnselect" :row-hover="true">
<Column selectionMode="multiple" headerStyle="width: 3em"></Column>
<Column field="label" :header="translation.money.serviceName">
</Column>
</DataTable>

调用Item Select和添加新Item时的函数(isNew=true(

const onRowSelect = (event, isNew = false) => {
const selectedItem = event.data ?? event;
if (isNew) {
selectedRows.value.push(selectedItem );
}
};

Answer 1

我知道已经晚了。但我也有同样的问题。因此，在这里发布决议，是否有助于任何人。

我能做到这一点的唯一方法是分配给selectedRows，而不是将数据推送给它。当我们将数据推送到数组时，vue似乎无法检测到变化。

那么是有效的

const onRowSelect = (event, isNew = false) => {
const selectedItem = event.data ?? event;
if (isNew) {
selectedRows.value = [...selectedRows.value, selectedItem];
}
};