跳到正文
山月行
返回

Redux TechStack

发布于
import { createStore } from "redux";

// 在 React 项目中需要维护: action/counter.js
const INCREMENT = "INCREMENT";
const DECREMENT = "DECREMENT";

// 在 React 项目中需要维护: reducer/counter.js
function counter(state = 0, action) {
  switch (action.type) {
    case INCREMENT:
      return state + 1;
    case DECREMENT:
      return state - 1;
    default:
      return state;
  }
}

// 在 React 项目中需要维护: store.js
const store = createStore(counter);
store.subscribe(() => console.log(store.getState()));

// 在 React 项目中需要维护: containers/Counter.js
store.dispatch({ type: INCREMENT });
// 1
store.dispatch({ type: INCREMENT });
// 2
  • combineReduers

  • bindActionCreator

  • connect

  • Provider

  • mapStateToProps

  • mapDispatchToProps

Redux TechStack

  • redux
  • react-redux
  • redux-thunk
  • redux-saga
  • redux-actions
  • reselect
  • redux-persist

分享本文:

上一篇
Node 中的 require 与 module
下一篇
React 关键字高亮组件实现:十行代码搞定文本高亮功能