我只使用没有Flux或Redux的ReactJS。 App组件存储状态并定义onClick,onChange事件等的处理程序。 为了尽量减少通过组件树的数据传递,我尝试将组件作为道具传递,例如
<Parent
childone={<ChildOne
some_prop={this.state.a}
some_prop_2={this.state.b}
childtwo={<ChildTwo some_prop={this.state.c} />}
>}
/>
渲染功能如下
render() {
return (
<div>
<span>lorem</span>{this.props.childone}<span>ipusm</span>{this.props.childtwo}
<div>
);
}
这有点奏效,但我认为这是错误的方法。 如果ChildOne是React.PureComponents,则浅比较将无法进行,因为childtwo属性并不简单,并且会触发重新渲染。
我应该如何在ReactJS中组成父子组件以最小化重新渲染?