Redux数据管理之action

1.action是一个plain object(平面对象),它的隐式原型对象指向Object.prototype,通过对象字面量的方式创建

action.__proto__ = Object.prototype

2.action必须有type属性,该属性用于描述操作的类型,类似于请求地址和请求方法的综合体,但没有对type类型有强制要求

3.在大型项目中,由于操作类型比较多,为了避免硬编码(hard code),会将action的类型存放到一个或一些单独的文件中(样板代码)

// /src/redux/action/action-type.js
export const INCREASE = Symbol('increase');
export const DECREASE = Symbol("decrease");
export const SET = Symbol("set");

4.为了方面传递action,通常会使用action创建函数(action creator)来创建action。

注意:action创建函数应该为无副作用的纯函数

纯函数的意义:便于测试、调试

a.不能以任何形式修改参数 b.不可以有异步 c.不可以对外部环境中的数据产生影响

// /src/redux/action/number-action.js
import * as actionTypes from './action-type';
/**
 * 得到一个用于增加数字的action
 */
export function getIncreaseAction() {
    return { type: actionTypes.INCREASE };
}
export function getDecreaseAction() {
    return { type: actionTypes.DECREASE };
}

5.通常使用payload表示附加数据,并不是强制要求

// /src/redux/action/number-action.js
import * as actionTypes from './action-type';
/**
 * 得到一个用于增加数字的action
 */
export function getIncreaseAction() {
    return { type: actionTypes.INCREASE };
}
export function getDecreaseAction() {
    return { type: actionTypes.DECREASE };
}
export function getSetAction(newNumber) {
    return { type: actionTypes.SET, payload: newNumber };
}

6.为了方便利用action创建函数来分发(触发)action,redux提供了一个函数bindActionCreators,该函数用于增强action创建函数的功能,使它不仅可以创建action,并且创建后会自动完成分发。

这样以后就不用通过store.dispatch(action)的方式去分发了。

const bindActions = bindActionCreators(numberActions, store.dispatch);
console.log(bindActions); // {getIncreaseAction: ƒ, getDecreaseAction: ƒ, getSetAction: ƒ}
bindActions.getIncreaseAction(); // 得到一个increase action,并直接调用dispatch分发