我有一个React组件(React v15.5.4),您可以将其他组件传递给:
class CustomForm extends React.Component {
...
render() {
return (
<div>
{this.props.component}
</div>
);
}
}
我有一个使用它的不同组件:
class SomeContainer extends React.Component {
...
render() {
let someObjectVariable = {someProperty: 'someValue'};
return (
<CustomForm
component={<SomeInnerComponent someProp={'someInnerComponentOwnProp'}/>}
object={someObjectVariable}
/>
);
}
}
一切都很好,但我想将 someObjectVariable prop传递给 CustomForm 中的子组件(在这种情况下,这将是 SomeInnerComponent ),因为在实际代码中你可以传递几个组件而不是像示例一样 .
请注意,我还需要传递 SomeInnerComponent 自己的道具 .
有没有办法做到这一点?
3 回答
您可以使用React.cloneElement来实现 .
像这样:
工作守则:
您可以像对待
SomeInnerComponent
那样做 .只需传递命名道具 .
里面
CustomForm
,编辑:
请找到working demo here .
你有几个选择来实现你的要求 .
}
或者你可以克隆组件道具并应用新的道具,如Mayank所说 . 在你的情况下