比Redux更容易上手的状态管理库

CNZPH 发布于2019-08-26 12:22 / 551人阅读

摘要：前言当项目越发复杂时，我们发现仅仅是提升状态已经无法适应如此复杂的状态管理了，程序状态变得比较难同步，操作，到处是回调，发布，订阅，这意味着我们需要更好的状态管理方式，于是就引入了状态管理库，如，，，等。

前言

当项目越发复杂时，我们发现仅仅是提升状态已经无法适应如此复杂的状态管理了，程序状态变得比较难同步，操作，到处是回调，发布，订阅，这意味着我们需要更好的状态管理方式，于是就引入了状态管理库，如Redux，Mobx，Jumpsuit，Alt.js等。

Mobx是什么

对于我来说Mobx几乎和Vue一样，通过监听数据的属性变化，可以通过直接在数据上更改就能触发UI的渲染，从而做到MVVM、响应式、上手快，Api简单等等。

安装 npm install mobx --save

原则

mobx支持单向数据流也就是动作改变状态，而状态的改变会更新所有受影响的视图。如下图

一个简单的react+mobx的计算实例

npm install mobx-react --save // 下载mobx
import { observable, action } c // 应用mobx
const counter = {
    state: observable({
        count: 0
    }),
        
    add: action(function() {
        this.state.count ++ 
    })
}
export default counter

// 这时候 counter的结构是这样的
{
    state: { count: 0 }
    add: function
}

// 现在我们将mobx和react联系起来；
import { observer } from "mobx-react"
import counter from "./counter"
const CouterView = () => {
return (
    
      { counter.state.count } //这里的count时计数器里的数据
           // 点击按钮会把数字加1
        
    )
}

export default observer(CouterView);
// 这样就实现了一个简单的mobx的数据管理库

小结

在mobx中没有reducer这一层，所以不需要为了action和reducer之间的通信而使代码高度抽象。
mobx里state的更新是很直观的，通过赋值行为即可，而不需要dispatch或者setState这样的方法。

写的不详细，如有需要者，请前往官方文档

云服务器 GPU云服务器比深度学习更强容易混淆的问题 webrtc的视频容易崩溃最容易实现的替换算法

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108580.html

我理想中的状态管理工具

摘要：现已存在许多成熟的状态管理解决方案，还有基于的但对于我个人来说，理想的状态管理工具只需同时满足两个特点简单易用，并且适合中大型项目完美地支持要做到这两点其实并不简单。所以我决定自己造一个可能是基于和最好的状态管理工具现已存在许多成熟的状态管理解决方案：Redux、Mobx、Mobx-state-tree，还有基于 Redux 的 Dva.js、Rematch... 但对于我个人来说，...

roadtogeek 2019-08-23 13:10 评论0 收藏0
React 教程：快速上手指南

摘要：由于其名气和稳定性获得了广泛好评。但是实际上在中并不是非常必要的。因此，这些结果也是纯粹的速度实验。它是否容易使用，开发过程是否令人愉快年和年的状态报告显示，和都享有良好的声誉，大多数开发人员表示会再次使用。上手最简单和最快的学习曲线。翻译：疯狂的技术宅原文：https://www.toptal.com/react/... 本文首发微信公众号：jingchengyideng欢迎关...

Vultr 2019-08-23 15:31 评论0 收藏0
Byemess-基于React&redux的在线Todo应用

摘要：在线注册账号，数据存储于。年了，还不使用的异步控制体系。过度对数据模型进行装饰的结果便是高耦合，这跟我初衷是基于在线存储数据有关。为什么又是Todo，全世界的初学者都在做todo吗？可能很多人要问这句话，其实这句话可以等同于：为什么你做了个云音乐播放器？为什么你做了个新闻阅读APP？为什么你做了个VUE/REACT版本的CNODE？究其本质，这几个应用都是data-map...

MRZYD 2019-08-20 17:07 评论0 收藏0
【译】Redux 还是 Mobx，让我来解决你的困惑！

摘要：我现在写的这些是为了解决和这两个状态管理库之间的困惑。这甚至是危险的，因为这部分人将无法体验和这些库所要解决的问题。这肯定是要第一时间解决的问题。函数式编程是不断上升的范式，但对于大部分开发者来说是新奇的。规模持续增长的应原文地址：Redux or MobX: An attempt to dissolve the Confusion 原文作者：rwieruch 我在去年大量的使用...

txgcwm 2019-08-22 11:06 评论0 收藏0
react+react-router4+redux最新版构建分享

摘要：相关配置请参考中文文档。关于的更多使用方法及理解需要详细具体讲解，涉及篇幅较大，本文暂不涉及，有兴趣可以看文档中文文档，我会整理后再单独章节分享接下来我们将编写路由组件这与有一些差别，原来的方法已经不再使用，在中或组件从中引入。相信很多刚入坑React的小伙伴们有一个同样的疑惑，由于React相关库不断的再进行版本迭代，网上很多以前的技术分享变得不再适用。比如react-...

weapon 2019-08-21 11:53 评论0 收藏0