疑问如题。举一个简单的例子:
<MyParentComponent gap={3}>
<MyChildA/>
<MyChildA/>
<MyChildB/>
<MyChildB/>
</MyParentComponent>
上面结构中,通过MyParentComponent中的gap属性来决定它的子组件之间的margin为3像素,也就是说,在MyParentComponent的定义中,需要对this.props.children的style进行修饰。
目前我的解决办法是遍历this.props.children,同时通过React.cloneElement(child, {style: someNewStyle})来克隆出修饰过样式之后的“子组件复制品”(因为this.props.children中的子组件不可修改)。
然而这样复制出额外组件的方法显然不是最优的,而且也繁琐,难以理解。
因此发来社区求助。如果上面的描述有不详细之处,请随时提出以便我及时补充。