将道具传递给孩子的孩子 React JS

Question

你好，我正在尝试将 props 传递给孩子的子组件

示例：

父母：

Onboarding()

<FilesOnboarding render={Onboarding}/>

文件载入：

updateFiles = () => {
 props.render()

}

<ProofFiles props.render={anotherRender?}> 

This is already wrong because I can't pass props.render={anotherRender} 

证明文件

updateFiles = () => {
 props.anotherRender()

}

Answer 1

codesandbox

父母

function Onboarding() {
  return <h2> Rendering from Parent component </h2>;
}

function Parent() {
  return <FilesOnboarding render={Onboarding} />;
}

FilesOnBoarding

function renderFromFilesOnBoarding() {
  return <h2> Rendering from FilesOnboarding component </h2>;
}

export default function Parent({ render }) {
  return (
    <>
      {render()}
      <ProofFiles anotherRender={renderFromFilesOnBoarding} />
    </>
  );
}

证明文件

function Parent({ anotherRender }) {
  return anotherRender();
}