Redux Toolkit中能否将reducer actions定义为嵌套对象？

Redux Toolkit（RTK）的createSlice 原生不支持示例中的嵌套reducer定义写法，直接使用会触发配置错误，无法正常生成action creator与对应的reducer处理逻辑。

createSlice对reducers字段的入参格式有明确约束，每个键对应的值仅支持两种类型：

• 标准reducer处理函数
• 包含reducer处理函数、prepare payload预处理回调的配置对象

示例中login: { requested: ..., received: ..., failed: ... }属于普通嵌套对象，既不是函数也不是符合要求的配置结构，RTK解析时无法识别内部的子属性，会直接抛出配置非法的报错，也不会生成预期的auth/login/requested格式action type。

想要按业务逻辑分层组织action、提升代码可读性，不需要依赖RTK的原生嵌套支持，两种简单写法就能实现完全一致的使用体验：

• 用带层级分隔符的字符串作为reducer键名
  RTK拼接action type时会直接使用传入的键名和slice name组合，用/作为层级分隔符定义键名，语义和嵌套结构完全对齐：

  const authSlice = createSlice({
      name: 'auth',
      initialState: {
          data: { token: null },
          status: 'idle',
          error: null
      },
      reducers: {
          'login/requested': state => {
              state.status = 'loading';
          },
          'login/received': (state, action) => {
              state.data.token = action.payload.token;
              state.status = 'succeeded';
          },
          'login/failed': state => {
              state.status = 'failed'
          }            
      }
  });
  

• 手动组装嵌套结构的actions集合
  导出时可以把扁平生成的action creator手动组装成目标嵌套结构，调用时的写法和预期的嵌套定义效果完全一致：

  const { actions, reducer } = authSlice;
  // 组装为层级结构
  const authActions = {
      login: {
          requested: actions['login/requested'],
          received: actions['login/received'],
          failed: actions['login/failed']
      }
  };
  
  // 调用时直接按层级引用即可
  dispatch(authActions.login.requested());
  

没有必要为了这个语法糖引入额外第三方依赖，上述手动组装的逻辑仅需几行代码，无额外维护成本，同时完全符合RTK设计规范，不会产生隐性兼容问题。

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