更新React中的兄弟组件

时间:2016-12-12 16:53:47

标签: javascript reactjs

我有一系列具有不同选项(材料,颜色,尺寸)的产品。第一个产品上的选项必须反映在他的每个兄弟姐妹身上。

例如,如果我在第一个产品上选择material: gold,则根据此选项更新所有下一个产品。

我想出的最好的想法是一个事件系统,它在更高阶的组件中共享,并在第一个产品发生变化时触发,但这意味着我必须使用一些引用来调用方法selectOption()兄弟姐妹...

     +------+
     |PARENT|
     |      |
     +------+
     /      \
+-----+    +-----+
| C1  |    | C2  |
|     |    |     |
+-----+    +-----+
   | <-ref    | <-ref
+-----+    +-----+
| P1  |    | P2  |
|     |    |     |
+-----+    +-----+

点击P1选项,我在C1中触发一个事件,C2拦截此事件并调用this.refs.P2.addOption('gold')

我不喜欢这个解决方案,因为这意味着我必须标记产品P1以使其触发事件而不像其他事件。

你有更优雅的想法吗?

0 个答案:

没有答案