首页 > 其他分享 >antdv: Each record in table should have a unique `key` prop,or set `rowKey` to an unique primary key

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

时间:2024-05-29 17:55:04浏览次数:8  
标签:set primary record key rowKey unique

在使用ant-design vue框架的时候,表格组件里面会碰到 Each record in table should have a unique key prop,or set rowKey to an unique primary key这样的报错,具体见下图

 

原因分析:
我看了一下官网,以及搜索了很多答案,最终原因是:
在 Table 中,dataSource 和 columns 里的数据值都需要指定 key 值。对于 dataSource 默认将每列数据的 key 属性作为唯一的标识。如果你的数据没有这个属性,务必使用 rowKey 来指定数据列的主键。若没有指定,控制台会出现缺少 key 的提示,表格组件也会出现各类奇怪的错误。

解决方案:

就是在<a-table></a-table>标签里面加上 :rowKey="(record, index) => { return index }" 这句话就可以解决啦~

<a-table 
      :row-selection="rowSelection" 
      :rowKey="(record, index) => { return index }" 
      :columns="columns"
      :data-source="data"
      bordered 
      :pagination="pagination">
     </a-table>

 

原文:https://blog.csdn.net/weixin_45003732/article/details/126519611

 

标签:set,primary,record,key,rowKey,unique
From: https://www.cnblogs.com/wjs2019/p/18220807

相关文章

  • get和set,?和 ?? ,?: ,?. ?:[]的用法和区别
    C#中,get和set访问器通常与属性(property)一起使用,用于定义如何读取和写入属性的值。属性提供了一种比字段(field)更灵活的方式来封装类的数据成员。区别用途:get访问器:用于读取属性的值。set访问器:用于设置属性的值。返回值:get访问器必须返回一个值,其类型必须与属性的......
  • Vue 3 设置中的新 `<script setup>` 语法是如何使用的?
    Vue3中的新<scriptsetup>语法详解Vue.js作为现代前端框架的一大代表,它简洁易用的特性和不断创新的理念吸引了一大批开发者。在Vue3中推出了很多改进和新特性,其中一个引起广泛关注的便是<scriptsetup>语法。这篇文章将详细介绍Vue3中的<scriptsetup>语法,......
  • .net6 类库 读取appsettings.json
    类库项目引入 Microsoft.Extensions.Configuration和 Microsoft.Extensions.Configuration.Json程序包以Sqlsugar读取配置文件为例:publicclassSqlsugarBase{publicstaticIConfigurationConfiguration{get;set;}staticSqlsugarBase()......
  • linux使用ipset禁止国外IP访问
    一、安装ipsetyuminstallipset-y二、禁止firewalldsystemctlstopfirewalldsystemctldisablefirewalld三、设置iptables默认允许规则iptables-PINPUTACCEPT四、清空其他规则[root@hlcc~]#iptables-F五、查看规则[root@hlcc~]#iptables-LChain......
  • TEST(MQ‘key)
    /**********************************************************************************************filename:HomeWork.c*author:[email protected]*data:2024/05/27*function:测试消息队列的键值key的组成*note:None**......
  • 在 Inno Setup 中检测 .NET 5 / .NET Core 运行环境是否存在
    为了将.NET5/.NETCore应用程序部署到客户机,我们可以编写InnoSetup代码来判断客户机是否安装了必要的运行环境。.NET官方仓库 中提供了一个名为 NetCoreCheck 的项目,可以用于检测指定的.NET5/.NETCore环境是否存在。编译好的文件可以从以下两个地址下载:文件......
  • Inno Setup Dependency Installer 安装包 运行环境安装
    Downloadandinstallanydependencysuchas.NET,VisualC++orSQLServerduringyourapplication'sinstallation!Inthisarticle,youwillseeinstallation,usage,integration,details,anddependenciesofInnoSetupDependencyInstaller.Downlo......
  • CF1463F Max Correct Set
    MaxCorrectSet考虑\(n\)的范围那么大,肯定要找到神秘结论。所以瞎考虑\(x=y\)的情况,不难想到放\(x\)个连续的数,再空\(x\)个不放,再放\(x\)个连续的。再考虑\(x\not=y\)的情况,我们猜测依旧是按循环节长度\(x+y\)一直放。结论:求出\([1,x+y]\)范......
  • Android Toast弹出消息在指定位置(setGravity)
    importandroid.widget.Toastimportandroid.view.Gravity默认Toast是显示在底部的,可以通过以下方法让其显示在顶部正中Toasttoast=Toast.makeText(SearchActivity.this,"取消关注失败",Toast.LENGTH_SHORT);toast.setGravity(Gravity.CENTER,0,0);toast.show();这样......
  • 基于FIDO2和USBKEY硬件的SSH认证
    在8.2(最新为8.3)版本中,OpenSSH提供了对FIDO和UAF的支持。从此用户就可以用硬件USBKEY证书进行SSH原生认证。这样可以实现简捷、有效和安全的SSH认证。本文我们就就少一下FIDO2以及OpenSSH对其的支持,并尝试一下基于FIDO2的SSH认证,前提需要一个USBkey设备......