Skip to content
CodingDiary
返回

redux 和 mobx 初体验

编辑页面
导读

前段时间搞了 Vue,现在又得开始写 React 了。 我堂堂的一个后端,真是太残忍啦 o(╯□╰)o 接触过 Vue 的应该都知道,Vue 的状态管理可以有两种实现,一种是 Vuex,还有一种是 eventBus 形式。 React 状态管理,老牌的应该是 Redux,但是存在了太多的概念,对于刚接触的童鞋不太友好。mobx 当属时代的新星了。不管从效率,还是易读性都远超 Redux。...

前段时间搞了 Vue,现在又得开始写 React 了。 我堂堂的一个后端,真是太残忍啦 o(╯□╰)o

接触过 Vue 的应该都知道,Vue 的状态管理可以有两种实现,一种是 Vuex,还有一种是 eventBus 形式。

React 状态管理,老牌的应该是 Redux,但是存在了太多的概念,对于刚接触的童鞋不太友好。mobx 当属时代的新星了。不管从效率,还是易读性都远超 Redux。

下面带来俩小🌰大家感受下~~

最简单的一个 redux 操作

import { createStore } from "redux";

const ADD_ACTION = "ADD";

const add = num => {
  return {
    type: ADD_ACTION,
    num,
  };
};

const initialState = {
  count: 0,
};

const reducers = (state = initialState, action) => {
  switch (action.type) {
    case ADD_ACTION:
      return Object.assign({}, state, { count: state.count + action.num });
    default:
      return state;
  }
};

const reduxStore = createStore(reducers);

reduxStore.dispatch(add(1));

最简单的一个 mobx 操作

import { observable, action } from "mobx";

const mobxStore = observable({
  count: 0,
  add: action(num => {
    this.count += num;
  }),
});

mobxStore.add(1);

编辑页面
分享到:

上一篇
提升 JAVA 编程技能
下一篇
Mac 下彻底解决 mysql 中文乱码问题