Action

在 Redux 中，Action 是把数据从应用传到 Store 的有效载荷，是 Store 数据的唯一来源。Action 本质上是一个普通 JavaScript 对象，按照 Redux 约定，Action 对象内必须使用一个字符串类型的type来表示 Action 将要执行的动作。

一般建议 Action 使用以下模板来设计。

const ADD_CONTENT = {
  type: 'ADD_CONTENT', // Action操作的类型，用于Reducer进行分支判断
  payload: {}, // Action的载荷，可以是任何类型，用于交给Reducer处理State
  error: false, // 布尔类型，表示Action是否代表一个错误
  meta: {} // 用于承载不隶属于payload的数据。
};

Action 一般会使用 Action 创建函数来完成创建，而不是手动书写。在 Redux 中，Action 创建函数只是简单的返回一个 Action，而不是像 Flux 中需要调用dispatch()。

const ADD_CONTENT = {
  type: 'ADD_CONTENT', // Action操作的类型，用于Reducer进行分支判断
  payload: {}, // Action的载荷，可以是任何类型，用于交给Reducer处理State
  error: false, // 布尔类型，表示Action是否代表一个错误
  meta: {} // 用于承载不隶属于payload的数据。
};

对于 Action 的type，其所有取值可以预先在一个文件中集中定义，这也防止 Reducer 在处理时出现书写错误，也便于书写。例如上面的 Action 书写到文件中可能是下面这个样子。

export const ADD_CONTENT = 'ADD_CONTENT';

export function addContent(content) {
  return {
    type: ADD_CONTENT,
    payload: content
  };
}

Live with React

Action