【问题标题】:MobX with React best practice with observerMobX 与 React 最佳实践与观察者
【发布时间】:2020-05-18 12:33:44
【问题描述】:

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

我对@9​​87654321@ 还很陌生,但我有多年使用react 的经验(主要是redux)。 我的新项目使用mobx-state-treemobx-react-lite,以便将我的组件与包装组件的函数observer 连接起来。我已经建立了一个根商店,里面有多个商店。 我现在对此非常感兴趣,但我想要一些建议:

我是否应该使用在 redux 中非常常见的容器逻辑,这意味着我应该只连接一个“容器”组件,该组件将处理与我的商店的连接并将其传播给它的孩子?或者我应该直接与观察者连接,需要从商店提供数据的许多组件?

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

任何答案将不胜感激

【问题讨论】:

    标签: reactjs mobx mobx-react mobx-state-tree mobx-react-lite


    【解决方案1】:

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

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

    在 shouldComponentUpdate 中使用大量检查来避免不必要的渲染是很常见的模式。 MobX 根本不需要这样做。

    我的观点是模式每月都会发生变化,因此学习一般概念可以轻松地从全局存储、本地存储、上下文、挂钩和其他 api 更改过渡。

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

    立即使用您需要和了解的内容。如果 5 年后无所谓,那就不要花超过 5 分钟的时间去想它。您总是可以进行有趣的重构。

    进一步阅读:

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

    https://mobx-react.js.org

    【讨论】:

    • 您可能已经注意到,这个问题已经有几个星期了,所以我自己几乎就得出了这个结论。但是您的回答仍然使我更加清楚。我相信它可以帮助其他有类似问题的人。谢谢老兄
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-08-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-09-07
    • 2022-01-20
    • 1970-01-01
    相关资源
    最近更新 更多