reactjs - MobX with React 与观察者的最佳实践

Question

我并没有真正面临问题，更像是我想知道我应该将 mobx 与 React 结合使用的最佳方式是什么。所以这是我的情况:

我是 mobx 的新手，但我有多年使用 react 的经验(主要是 redux)。我的新项目使用 mobx-state-tree 和 mobx-react-lite 来连接我的组件和函数 observer 包装零件。我已经建立了一个包含多个商店的根商店。我现在真的很热心，但我想要一些建议:

我是否应该使用 redux 中很常见的容器逻辑，这意味着我应该只连接一个“容器”组件，该组件将处理与我的商店的连接并将其传播给它的 child ？还是我应该直接与观察者联系，因为需要从商店提供数据的组件数量多吗？

从技术上讲，第二个选项是否更优化？根据 React 哲学，这仍然是一个好主意吗？你对这个问题有什么看法？

任何答案将不胜感激

Answer 1

从技术上讲，您不需要容器/展示概念。您可以使用上下文、localStore 或 globalStore，但这并不意味着容器/表示有时没有用。

Mobx 修补了 shouldComponentUpdate 生命周期，基本上为您优化了组件渲染。mobx-react 在他们的文档中提到，与观察者连接的组件越多越好。

It's very common pattern to see shouldComponentUpdate with a bulky checks to avoid unnecessary renders. This isn't needed with MobX at all.

我的观点是，模式每月都会发生变化，因此了解一般概念可以简化您从全局商店、本地商店、上下文、 Hook 和其他 API 更改的过渡。

React 组件模式也会随着时间的推移而改变。

立即使用您需要和了解的内容。如果 5 年后它不再重要，请不要花超过 5 分钟的时间来考虑它。您总是可以进行有趣的重构。

进一步阅读:

https://mobx.js.org/README.html

https://mobx-react.js.org