将全局值传递给子组件

Question

我正在尝试确定将全局值传递给子子组件的最佳方法。我之前通过参考我的最高级别的父母传递给每个孩子（大约3-4层深）。我不是很喜欢这种方法。我的假设是，只要根值发生变化，反应就是比较值并不必要地计算它们的任何变化。

我能想到的唯一其他解决方案是将值存储在窗口属性的名称空间中，即。 window.myapp.settings = {}会从道具中移除它，因此不会影响整体应用程序的性能。

Answer 1

React不会观察您的对象是否有变化而且没有。当你调用setState时，你实际上是在要求改变组件的状态并重新渲染它。 setState将更新该子树而不是整个应用。

删除一个或两个键对React或一般的JS没有任何影响。如果你不知道，<MyComp a="h" b="e" />去了MyComp({a: 'h', b: 'e'})。

如果你只是为了perf而试图传递一个全局obj，那就不要打扰了;你不会在那里节省毫秒。但是，是的，你可以将你的组件作为一种良好的做法尽可能无状态地保持在树下。

Answer 2

我在使用i18next在我的React项目中实现国际化时遇到了类似的问题。在我的组件树中将i18n实例作为props传递到任何地方都感到很乏味。我也最终设置了window属性，但感觉不对！

React中提供的Context是实验性的，文档中的注意让我在初次考虑使用它时改变主意：

  

上下文是一项高级实验性功能。 API可能会   未来版本的变化。

     

大多数应用程序永远不需要使用   上下文。特别是如果你刚开始使用React，那么你   可能不想使用上下文。使用上下文将使您的代码   更难理解，因为它使数据流不太清晰。它是   类似于使用全局变量通过您的状态传递状态   应用。

     

如果您必须使用上下文，请谨慎使用。

     

不管   无论您是在构建应用程序还是库，都要尝试隔离   您将上下文用于小区域并避免使用上下文API   直接在可能的情况下，以便在API时更容易升级   变化。