我有一系列具有不同选项(材料,颜色,尺寸)的产品。第一个产品上的选项必须反映在他的每个兄弟姐妹身上。
例如,如果我在第一个产品上选择material: gold
,则根据此选项更新所有下一个产品。
我想出的最好的想法是一个事件系统,它在更高阶的组件中共享,并在第一个产品发生变化时触发,但这意味着我必须使用一些引用来调用方法selectOption()
兄弟姐妹...
+------+
|PARENT|
| |
+------+
/ \
+-----+ +-----+
| C1 | | C2 |
| | | |
+-----+ +-----+
| <-ref | <-ref
+-----+ +-----+
| P1 | | P2 |
| | | |
+-----+ +-----+
点击P1选项,我在C1中触发一个事件,C2拦截此事件并调用this.refs.P2.addOption('gold')
我不喜欢这个解决方案,因为这意味着我必须标记产品P1以使其触发事件而不像其他事件。
你有更优雅的想法吗?