如何将react children呈现为而不是{children}[重复]

Question

我有一个简单的组件：

const Test = ({header}) => <View> <Header /> </View>`

这样称呼它：

<Test header={<View> Test </View} />

但它没有说：

JSX元素类型“Header”没有任何构造或调用签名

我该怎么解决这个问题？我需要把它渲染成

我不想像这样渲染它。




Answer 1

如果你想达到这个目标，请告诉我

常量测试=（{标头：标头}）=

Answer 2

你可以这样做：

const Test = ({children}) => <View> {children} </View>

并像这样使用它：

<Test>
  <Header/>
</Test>

有关详细信息，请阅读文档合成vs继承

Answer 3

如果您想将道具传递给您的孩子，请查看带有函数cloneElement的React API

你可以使用React来教育你的孩子。孩子们

function Component({ children, ...props }) {
    const newChildren = React.Children.map(children, child => {
        return React.cloneElement(child, { ...child.props, ...props });
    });
   return (
       <div>
          {newChildren}
       </div>
);

}