要将数据从AntD表传递到React中的另一个组件,可以通过以下步骤实现:
以下是一个示例代码:
// 父组件
import React, { useState } from 'react';
import { Table } from 'antd';
const ParentComponent = () => {
const [data, setData] = useState([
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Bob' },
]);
return (
<div>
<Table dataSource={data} columns={columns} />
<ChildComponent data={data} />
</div>
);
};
// 子组件
const ChildComponent = (props) => {
const { data } = props;
return (
<div>
<h2>Data from AntD Table:</h2>
<ul>
{data.map((item) => (
<li key={item.id}>{item.name}</li>
))}
</ul>
</div>
);
};
在上述示例中,父组件中的data状态存储了表格的数据,通过props将data传递给了子组件ChildComponent。子组件中接收到data后,可以根据需要进行渲染或其他操作。
注意:上述示例中使用了AntD的Table组件和useState钩子,如果需要使用其他UI库或类库,可以根据具体情况进行相应的调整。
领取专属 10元无门槛券
手把手带您无忧上云