reactjs - 如何在反应中将数组数据发送到一个组件到另一个组件？

Question

我有一个名为cards.js 的组件保存Json 数据，我还有一个名为tabledata.js 的独立组件，我只想在用户单击卡片时将数组数据从card.js 传递给这个tabledata.js 组件。我该怎么做，我需要帮助。 在此处输入图像描述

这是项目文件夹结构。

这是 Cards.js 代码这里我正在尝试将 Data 对象发送到 TableData.js

{Data.map((items) => {
          return (
            <>
                <TableData row={items}/>
              <Card
                className={classes.root}
                onClick={() => {
                 
                }}
              >

这是 TableData.js 代码

function TableData({row}) {
const classes = useStyles();

const [rows, setRows] = useState(row);

{rows.map((e)=>{
console.log(e);
 })}

标签： reactjsreact-hooks

Answer 1

告诉我这是否有效：

        {Data.map((items) => {
                  return (
                      <Card
                        className={classes.root}
                        onClick={() => {
                         <TableData row={items}/>
                        }}
                      />
                        )
              }