【简明】To learn Redux

来源:互联网 发布:云计算对个人的影响 编辑:程序博客网 时间:2024/05/22 10:43
  • flux&redux

  • state&reducer

Action 有事情发生了

  • Store 数据的唯一来源, store.dispatch()将action传到store
  • Action本质是普通对象 ,type字段,action type字段…结构自定
  • bindActionCreators()自动把多个action创建函数绑定到dispatch方法上

Reducer 更新state

  • 纯函数,接收旧的state和action,返回新的state

严格的单向数据流

  1. 调用store.dispatch(action)
  2. store 调用传入的reducer函数
    // render 返回处理后的应用状态
    let nextState = todoApp(previousState, action);
  3. 根 reducer 应该把多个子 reducer 输出合并成一个单一的 state 树
    Redux 原生提供combineReducers辅助函数,来把根reducer 拆分成多个函数,用于分别处理 state 树的一个分支。
  4. Redux store 保存了根 reducer 返回的完整 state 树。

Middleware 中间件

Paste_Image.png

  • 函数式编程思想设计,redux 提供了 applyMiddleware 这个 api 来加载 middleware,applyMiddleware 会对 logger 这个 middleware 进行层层调用,动态地对 store 和 next 参数赋值。
  • * 给 middleware 分发 store*
  • compose组合串联 middlewares
  • 在middleware 中调用 store.dispatch() 和在其他任何地方调用效果是一样的,而在 middleware 中调用 next(),效果是进入下一个 middleware;
    在 middleware 中使用 dispatch 的场景一般是:接受到一个定向 action,这个 action 并不希望到达原生的 dsipatch,存在的目的是为了触发其他新的 action,往往用在异步请求的需求里。

Droidux

Paste_Image.png

  • 参考
    https://github.com/izumin5210/Droidux
0 0
原创粉丝点击