Antd ui 有关table key问题报错

Mtao&

已于 2022-08-17 10:22:08 修改

阅读量371

点赞数

CC 4.0 BY-SA版权

分类专栏： vue 文章标签：前端 vue.js

于 2022-08-17 10:18:48 首次发布

本文链接：https://blog.youkuaiyun.com/qq_45186619/article/details/126380147

vue 专栏收录该内容

18 篇文章

订阅专栏

本文介绍如何在使用Ant Design的表格组件时，正确设置rowKey属性以避免报错。通过提供示例代码，展示了如何将record.id作为rowKey，确保数据正确关联。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

不绑定key 值报错

解决办法: [ :rowKey ]
:rowKey=‘record=>record.id’

<a-table v-if="tableList.length>0" :columns="columns"  :rowKey='record=>record.id'  :data-source="tableList" :pagination="false">
      <!-- <a slot="name" slot-scope="text">{{ text }}</a> -->
      <template slot="memberContact" slot-scope="record,text">
        <div>
          <p>账号:{{text.user_name}}</p>
          <p>昵称:{{text.nickname}}</p>
          <p>手机号码:{{text.mobile}}</p>
        </div>
      </template>
      <template slot="uploadDownload" >
        <div>
          <a-button>查看</a-button>
        </div>
      </template>
    </a-table>