React JS如何避免深回调

Question

我的问题是“当我想访问/对子组件数据作出反应时，是否有避免在树中发送回调的方法”。

我有一个包含一个子组件Person又包含一个子组件TraitCollection又包含一个子组件Trait组件Application。

当Trait改变我想要将数据发送回Application在Application命名PersonList被转发到另一个孩子。

我现在的解决方案是将回调作为道具发送给每个孩子。每个回调函数构造并附加最终到达Application的数据，我将其作为道具传递给PersonList。

我可以想象，“增加更多层次”，或者将组件分成更小的部分会使这个回调链进一步复杂化。

是否有任何其他方式来做到这一点，或者这是处理从儿童到React父母的传递数据的最佳方式？

Answer 1

您处理它的方式是建议的方式和最反应类似。除了你发现的问题之外，这种方法本身没有任何问题。它看起来像Redux可以帮助你解决这个问题。 Redux可让您将React应用程序的状态统一为使用普通商店和基于动作创建者，动作和缩减器的良好设计模式。

Answer 2

您可以直接使用React Context https://facebook.github.io/react/docs/context.html，但更好的选择将使用React-Redux，它将允许您避免传递回调，并且您将能够更改任何组件的状态（连接到存储）具有派遣功能。