我想了解更多关于在react中通过父子传递 prop 的最佳实践。问题在于在中型项目中要有一个标准的方法来最大限度地减少混乱和技术债务，例如性能优化。到目前为止，我只知道这些方法：
1.标准支撑钻井
Pros: easy
Cons: will become unmanageable in complex feature1.利用React上下文
Pros: medium difficulty, naturally separate from main component
Cons: more time to write, may be unnecessary for smaller components, will do re renders that will cause performance issues headaches in, for example, large forms.1.使用来自“reactn”模块的全局状态
Pros: easy
Cons: will get unmanageable for large projects that have tons of components, cannot prevent rerender AFAIK.1.使用Redux
Pros: robust and compatible with firebase (react-redux-firebase, redux-firestore), can prevent rerender using areStatesEqual,
Cons: more boilerplates, more work to do for simpler state management是否有一个关于标准实践的指导方针来做这件事？你们的人用什么来做大中型项目？谢谢！
3条答案
按热度按时间0aydgbwb1#
The following answer is subjective!基本上有3个类别，我知道.
1.保持所有内容本地化（对于任何大小的不处理兄弟依赖关系的应用程序，这都可以正常工作。可能会导致一些属性钻取，尽管应该尽可能避免，但这不是反模式。您可以使用更好的方法来处理此问题，例如
PureComponent、React.memo、shouldComponentUpdate）1.保持所有内容全局化（
redux/reactN/...）（在我的经验中没有见过这种方法，在我看来不推荐，因为每次发生变化时都需要点击中心状态）1.保持两者的混合。（这在大中型项目中非常常见，我们在redux中使用这种方法）
选择选项：
1.就个人而言，不管应用程序的大小如何，都可以从第一种方法开始，然后在需要时添加中心状态（如果您不确定将状态放在哪里）。
1.如果您需要从一开始就集中管理某个状态，可以从头添加（如果状态定义明确）。
如果您选择上述两种方法中的任何一种，开始，在某个时间点，您需要决定是选择第一方（如
React Context）还是第三方（如Redux, ...）。你已经陈述了这些的利弊，你可以比较一下，看看哪一个比其他的更重要。
jv2fixgn2#
对于您提供的列表中的一个简单答案，我建议使用redux，编写action和reducer确实会增加一定的开销，随着react的发展和成熟，现在似乎可以管理大型应用程序而不使用redux：但是一旦你知道了redux是如何工作的，你就可以轻松地扩展了。这对于react-redux初学者-中级开发者来说是一个很好的解决方案。
我给你的最好建议是只使用react。useContext和useReducer会让你走得很远，但是它需要一个中等经验的开发技能。这种方法将迫使你在数据结构、组件封装和高级react模式的使用上投入时间。（我会注册像https://kentcdodds.com/workshops/advanced-react-patterns这样的课程）
8cdiaqws3#
根据您对
react-redux-firebase和redux-firestore的引用，我假设您正在使用Firestore。我更喜欢在Firestore中为大多数大中型应用程序使用Context（这是您的选项#2）。但是，正如您所指出的，设置和管理Context有点麻烦，所以我最终在React应用程序中为Firestore编写了自己的状态管理库。
您可能需要查看@gmcfall/react-firebase-state。它消除了大部分繁重的工作。此外，当Concurrent React启动时，它可以灵活地处理可能发生的多次挂载/卸载循环。