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

GhostCoder
  • 249

官方的 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 所以各种东西都很模糊,希望解惑谢谢

回复
阅读 486
1 个回答

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

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

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

你知道吗?

宣传栏