如何将祖父组件中的函数传递给 ReactJs 中的孙子组件？

Question

我想知道如何将祖父组件中的函数传递给祖child 组件。
我在 Grandparent 组件中有一个函数，它获取 id 和 slice()。但是id来自grandchild.
顺序是这样的

<Manager />
    <RecordList />
       <RecordItem />

当点击按钮时，它应该给来自的函数id
没有 Context API 怎么办？
并使用 将道具传递给 child

你能举个例子吗？谢谢大家

Answer 1

您可以在 React 中使用 Context API，并且可以将任何数据传递给特定组件下的任何 child 嵌套器。

Context API React

编辑既然你提到你不想使用 Context API。对于像这样的东西，child 只有一个组件深，你可能可以通过中间的 child 传递一些道具。我会给你一些粗略的想法，因为你在示例中没有编写代码，所以不可能完整地写出来。

<Manager>
    const childBtnClick = (params) => {
         // do you stuff here
    }
    <RecordList childBtnClick={childBtnClick}></RecordList>
</Manager>
<RecordList>
    <RecordItem childBtnClick={props.childBtnClick}></RecordItem>
</RecordList>
<RecordItem>
    <Button onClick={() => props.childBtnClick('passwhat data you want here')}></Button>
</RecordItem>

如何将祖父组件中的函数传递给 ReactJs 中的孙子组件？

How Can I pass a function in grandparent component to grandchild components in ReactJs?

javascript

reactjs

react-props