如何将Redux中的action抽离到单独文件？基于现有代码的技术咨询

问题1：你代码中的action是什么 #

Redux 规范里的 action 本质是携带type字段的普通 JavaScript 对象，作用是告诉 reducer 要执行什么类型的状态修改，可选的payload字段用来携带更新需要用到的参数。
你当前代码里和 action 相关的内容分为两部分：

• GET_REQUEST：是 action 类型常量，用来唯一标记一类操作，避免后续写代码时硬编码字符串出现拼写错误
• GetCommitsAndMembersDataAction：是 action creator（action生成函数），调用时传入你需要的 payload 就能直接返回符合格式的 action 对象，传给 dispatch 方法就能触发 reducer 执行状态更新

问题2：如何把action抽离到独立文件 #

你可以按照以下步骤操作：

1. 新建专门存放当前模块 action 的文件，比如命名为itemsActions.js，把 action 类型常量、action creator 都移到这个文件中，文件内容如下：

// action 类型常量
export const GET_REQUEST = "GET_REQUEST";

// action 生成函数
export const GetCommitsAndMembersDataAction = (payload) => ({
  type: GET_REQUEST,
  payload,
});

2. 修改你原有的 reducer 文件，移除已经抽离的常量和函数，改为从新建的 action 文件导入依赖：

import { GET_REQUEST } from './itemsActions.js';

const initalState = {};

export default function iteams(state = initalState, action) {
  switch (action.type) {
    case GET_REQUEST:
      return { ...state, ...action.payload };
    default:
      return state;
  }
}

3. 后续在组件中需要触发该 action 时，直接从itemsActions.js导入对应的 action 生成函数即可，不用再从 reducer 文件中导入相关内容，模块职责拆分更清晰。

内容的提问来源于stack exchange，提问作者evaldschukin