antdv: Each record in table should have a unique `key` prop,or set `rowKey` to an unique primary key

最新推荐文章于 2023-10-19 15:24:36 发布

原创最新推荐文章于 2023-10-19 15:24:36 发布 · 4.9k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端

在Ant Design Vue的表格组件中，确保每行数据具有唯一标识至关重要。通常，可以通过使用后台返回的唯一ID或使用数组索引来实现。示例代码展示了如何通过`rowKey`属性设置`lists`数组中每条记录的ID或索引作为唯一标识。

在这里插入图片描述
含义：[antdv:表中的每条记录都应该有唯一的’ key ’ prop，或者将’ rowKey '设置为唯一的主键。]

一般这种情况的消除就直接用表格的每一行的单独的主键id就行了（后台返回值一般这种列表都会返回主键唯一id，不行的话就用index数组下标也不会重复

 <a-table
        class="mr10"
        :columns="fields"
        :dataSource="lists"
        :pagination="false"
        //加个index或者id就可
        :rowKey="lists => lists.id"  ||   :rowKey="lists => lists.index"
 >