代码修改

根据 1.9.0 中的描述，我们在 RTK 2.0 主要版本中从 createReducer 和 createSlice.extraReducers 中移除了 "object" 参数。我们还添加了一种新的可选形式的 createSlice.reducers，它使用回调而不是对象。

为了简化代码库升级，我们发布了一组代码修改工具，它们将自动将已弃用的 "object" 语法转换为等效的 "builder" 语法。

代码修改工具包在 NPM 上以 @reduxjs/rtk-codemods 的形式提供。它目前包含以下代码修改工具：

• createReducerBuilder：将使用已移除的 object 语法的 createReducer 调用迁移到 builder 回调语法
• createSliceBuilder：将使用已移除的 object 语法的 createSlice 调用（用于 extraReducers）迁移到 builder 回调语法
• createSliceReducerBuilder：将使用仍然是标准的 object 语法的 createSlice 调用（用于 reducers）迁移到可选的新 builder 回调语法，包括对已准备好的 reducer 的使用

要对您的代码库运行代码修改工具，请运行 npx @reduxjs/rtk-codemods <TRANSFORM NAME> path/of/files/ or/some**/*glob.js。

示例

npx @reduxjs/rtk-codemods createReducerBuilder ./src

npx @reduxjs/rtk-codemods createSliceBuilder ./packages/my-app/**/*.ts

我们还建议在提交更改之前重新对代码库运行 Prettier。

这些代码修改工具应该有效，但我们非常感谢您在更多真实世界代码库上进行测试和反馈！

之前

createReducer(initialState, {
  [todoAdded1a]: (state, action) => {
    // stuff
  },
  [todoAdded1b]: (state, action) => action.payload,
})

const slice1 = createSlice({
  name: 'a',
  initialState: {},
  extraReducers: {
    [todoAdded1a]: (state, action) => {
      // stuff
    },
    [todoAdded1b]: (state, action) => action.payload,
  },
})

之后

createReducer(initialState, (builder) => {
  builder.addCase(todoAdded1a, (state, action) => {
    // stuff
  })

  builder.addCase(todoAdded1b, (state, action) => action.payload)
})

const slice1 = createSlice({
  name: 'a',
  initialState: {},

  extraReducers: (builder) => {
    builder.addCase(todoAdded1a, (state, action) => {
      // stuff
    })

    builder.addCase(todoAdded1b, (state, action) => action.payload)
  },
})