我们假设我有一个父App组件，通过将其作为Settings对象向下传递，将用户设置保存在其状态并在我的应用中同步给所有孩子。
为了论证，我们假设App有两个其他子组件，一个名为Settings组件，它包含一个表单，用户输入他/她的设置和点击提交以提交设置。
另一个Foo组件，它根据用户在早期表单中为应用选择的设置来投影/显示/隐藏各种元素或其他组件。
这两个组件不会一起呈现，只有在用户提交表单后才会显示Foo组件。
现在我发现自己纠缠在两种方法之间：一种是将所有设置保存在我的Settings组件内保存的状态，每次输入更改时，只更新Settings＆＃ 39;相应的组件状态，通过为每个输入设置一个处理程序，并通过回调（将更新App的状态）将所有这些设置传递给App组件用户提交表单。
或者，使Settings成为无状态组件，并将所有输入处理程序作为回调（或作为一个统一回调）传递给App组件，然后在每次输入更改时更新状态。 / p>
作为一名老派的Web开发人员，我更喜欢第一种方法，因为它只更新了App组件一次，因此它只重新呈现所有子组件一次，而我的{{1组件保持独立于Settings组件，它们唯一的接口是App回调，它将整个设置对象传递一次。
另一方面，第二种方法将所有逻辑和处理与OnSubmit组件分开，删除多余的状态，并将其保留为简单的UI＆＃34; view＆＃34;组件，如果你愿意。看起来像我见过的许多React应用程序中常用的设计模式。
哪种方法更好，为什么？还有什么我错过的吗？你怎么去处理这个？ React中亲子互动的最佳实践是什么？您希望将您的子组件封装多少并独立于其环境中？你想从父母到孩子传递多少回调？
我也非常感谢一些很好的参考资料和阅读材料..
感谢。
答案 0 :(得分：1)
在React中始终首选处于顶级组件和无状态子组件的状态。
关于回调，传递相关的＆＃39;那些下来再次是首选。什么是非常主观的。但可读性必须是最重要的，而且回调率最高。与儿童部分的相关性。
在我们的大型代码库中，我们最多只有3个回调，并且从最顶层的组件中嵌套不超过2个级别。我们广泛使用ES6解构，Immutability Helpers，三点...操作员来管理顶级组件的状态（从子节点接收数据）并将所有孩子保持为无状态组件。
这有助于我们改进测试，并且对组件也有很高的覆盖率。更容易阅读和更好的组件是无状态组件的明确结果。
如果您的组件需要＆＃39;事件＆＃39;传递下来而不是状态（数据），或者如果你的嵌套级别超过2并且代码无法管理，那么你必须探索像Redux这样的状态管理框架（例如，）。
谢谢， 斯利拉姆
答案 1 :(得分：0)
答案 2 :(得分：0)
我建议使用flux pattern，您可以将您的状态放入数据存储，并允许组件共享数据并监视更改，这样可以避免层次结构中的处理程序和道具爆炸。