使用自定义列键为每个列指定唯一的标识符

在 Ant Design (Antd) 的表格组件中，如果在 columns 数组中使用相同的 key 值创建多个列，就会导致表格出现重复列的问题。为了解决这个问题，我们可以使用自定义的列键来为每个列指定唯一的标识符。例如：

import {Table} from 'antd';

const columns = [ {title: '姓名', dataIndex: 'name', key: 'name'}, {title: '年龄', dataIndex: 'age', key: 'age'}, {title: '性别', dataIndex: 'gender', key: 'gender'}, {title: '年龄', dataIndex: 'age', key: 'age_2'}, // 自定义列键 ]

const data = [ {name: '张三', age: 18, gender: '男'}, {name: '李四', age: 19, gender: '女'}, {name: '王五', age: 20, gender: '男'}, ]

在上面的代码中，我们为第四列的 key 属性指定了一个自定义的标识符 "age_2"，以避免与第二列的 "age" 冲突。这样就能够避免出现重复列的问题了。