首页 > 解决方案 > Vuejs v-for 重复结果在没有重复键的表中

问题描述

我的代码很简单。我在这样的表格主体元素中有一个 v-for 。

<tbody v-for="rowdata in tableDataArray" :key="rowdata.id">

我将数据推送到函数内的 tableDataArray 中。

在 tbody 内部,我像这样打印数据。

<tr>
<td>{{ rowdata.name }}</td>
<td>{{ rowdata.age }}</td>
</tr>

我的模板中没有任何其他 v-for。

我在控制台中收到此错误并将多个重复数据添加到表中。

[Vue warn]: Duplicate keys detected: 'file1'. This may cause an update error.

found in

---> <TableDataPage> at src/components/TableDataPage.vue
   <App> at src/App.vue
     <Root>

我注意到这个错误是由于 v-for 使用相同的键,但在我的情况下,我只使用了一个 v-for。

标签: javascriptvue.jsvue-component

解决方案


推荐阅读