Antd Table 组件动态表头的问题 React

官方的 DEMO 和网上据大部分的资料都是将 columns 写死的如下:

const columns = [
  {
    title: '姓名',
    dataIndex: 'name',
    key: 'name',
  }
];

<Table dataSource={dataSource} columns={columns} />;

但我想实现的是表头 columns 是从接口请求过来的,那该怎么弄?弄了很久都弄不出来:

const [columns, setColumns] = useState([]);
setColumns(async()=>{
    return await R_Resource_Select(routerParams.builder);
});
<Table dataSource={dataSource} columns={columns} />

因为刚用 React 所以各种东西都很模糊,希望解惑谢谢

阅读 10.4k
1 个回答

首先请求返回的数据必须要有title(显示的名字)、dataIndex(数据里取的key名)

// 如果他的格式直接是
const mock = [{
    title: xxx,
    dataIndex: xxx,
}]
// 那你就直接赋值就行了
const columns = mock;

如果不是那你就把数据自己组装成{title:...,dataIndex:...}

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题