Action
Action是store数据的唯一来源。需使用store.dispatch()将所需的action传到store。Action是把服务器响应的数据或者用户输入的数据、和其他一些非View的数据传入store的有效载荷。Action实际上是JS的普通对象。示例:
{ type:"ADD_TODO", //type为必须的字段,值为字符串或存放字符串的变量 text:"我是示例" }
需要注意的是:应该尽可能的减少在action中传递的数据。
Action创建函数
Action创建函数只是简单的返回一个action。示例:
function addTodo(text) { return { type: ADD_TODO, text } }
Redux提供的bindActionCreators()可以自动把多个action创建函数绑定到dispatch()方法上。
Reducer
Reducers 指定了应用状态的变化如何响应 actions 并发送到 store 的,记住 actions 只是描述了有事情发生了这一事实,并没有描述应用如何更新 state。
reducer 就是一个纯函数,接收旧的 state 和 action,返回新的 state。
(previousState, action) => newState
永远不要在reducer里做这些操作:
- 修改传入参数;
- 执行有副作用的操作,如API请求和路由跳转;
- 调用非纯函数,如Data.now()或Math.random();
reducer一定要保持纯净。只要传入参数相同,返回计算得到的下一个state就一定相同。没有特殊情况、没有副作用、没有API请求、没有变量修改,单纯执行计算
扫描二维码关注公众号,回复:
2109461 查看本文章
combinerReducers()方法只是生成一个函数,这个函数用来调用你的一系列reducer,每个reducer根据他们的key来筛选出state中的一部分数据并处理,然后这个生成的函数再将所有reducer的结果合成一个大的对象。
//ES6的写法 import { combineReducers } from 'redux' import * as reducers from './reducers' const todoApp = combineReducers(reducers)
Store
Store的职责:
- 维持应用的state;
- 提供 getState() 方法来获取state;
- 提供 dispatch(action) 方法更新state;
- 通过 subscribe(listener) 注册监听器;
- 通过 subscribe(listener) 返回的函数注销监听器;
Redux 应用只有一个单一的 store
store的使用示例:
//创建store let store = createStore(todoApp); //打印初始状态 console.log("初始状态======》",store.getState()); //每次state更新时,打印日志 //注意subscribe()返回一个函数用来注销监听器 const unsubscribe = store.subscribe(()=>console.log("state有更新=======》",store.getState())) //发起一系列action store.dispatch(addTodo("learn about actions")); store.dispatch(addTodo("learn about reducers")); store.dispatch(addTodo("learn about store")); store.dispatch(toggleTdo(0)); store.dispatch(toggleTdo(1)); store.dispatch(setVisibilityFilter(VisibilityFilters.SHOW_COMPLETED)); //停止监听 unsubscribe();
数据流
Redux应用中数据的生命周期遵循4个步骤:
- 调用 store.dispatch(action) 。 action 就是一个描述“发生了什么”的普遍对象,可将其理解为通过 store.dispatch 来告诉reducer发生了什么
- Redux store调用传入的reducer函数。根据传入的action.type来更新state
- 根reducer应该把多个子reducer输出合并成一个单一的state树。可使用原生的 combineReducers() 辅助函数,也可自己实现
- Redux store保存了根reducer返回的完整的state树