react antd protable tableRender怎么拿返回值里面的data是一个对象的数据
时间: 2024-04-16 13:27:07 浏览: 227
你可以使用 tableRender
组件的 dataIndex
属性来指定数据对象中的字段,然后在 render
函数中通过参数获取到对应字段的值。以下是一个示例:
import React from 'react';
import { Table } from 'antd';
const dataSource = [
{
id: 1,
name: 'John',
age: 25,
},
{
id: 2,
name: 'Jane',
age: 30,
},
];
const columns = [
{
title: 'ID',
dataIndex: 'id',
key: 'id',
},
{
title: 'Name',
dataIndex: 'name',
key: 'name',
},
{
title: 'Age',
dataIndex: 'age',
key: 'age',
render: (text, record) => {
// 使用 record.age 获取 age 字段的值
return <span>{record.age}</span>;
},
},
];
const MyTable = () => {
return <Table dataSource={dataSource} columns={columns} />;
};
export default MyTable;
在上述示例中,我们定义了一个包含 id
、name
和 age
字段的数据源 dataSource
。然后,我们在 columns
中通过设置 dataIndex
来指定数据源字段。在 render
函数中,我们使用 record.age
来获取数据对象的 age
值,并进行渲染。
你可以根据自己的需求修改示例中的字段和渲染方式。希望能对你有所帮助!
相关推荐

















