Question

我在我的prepare减速器中包含的addEntity回调函数中遇到了麻烦，我在redux-toolkit的createSlice函数中包含了该回调函数。

我正在尝试使用prepare回调向操作负载中添加唯一ID。

redux-toolkit createSlice documentation说：

如果您需要通过prepare回调来自定义操作创建者的有效负载值的创建，则reducers参数对象的适当字段的值应为对象而不是函数。该对象必须包含两个属性：reducer和prepare。 reducer字段的值应为case reducer函数，而prepare字段的值应为prepare回调函数。

这是我正在使用的代码（用TypeScript编写）：

import { createSlice, createEntityAdapter } from '@reduxjs/toolkit';
import { MyEntityType } from '../../js/types/MyEntityType';
import { v4 as uuidv4 } from 'uuid';

const myEntityAdapter = createEntityAdapter<MyEntityType>();

const { reducer, actions } = createSlice({
    name: 'myEntity',
    initialState: myEntityAdapter.getInitialState(),
    reducers: {
        addEntity: {
            reducer: myEntityAdapter.addOne,
            prepare: (payload) => ({...payload, id: uuidv4()}),
        },
        removeEntity: myEntityAdapter.removeOne,
        updateEntity: myEntityAdapter.updateOne,
    }
});

但是，当我编译应用程序并测试使用addEntity操作创建实体时，prepare回调似乎没有任何作用。

这是我使用Redux DevTools调度的操作：

{
 type: 'myEntity/addEntity',
 payload: {myPayloadTrait: 100, id: 'test'} // Expected behavior: this id should be overwritten in the prepare callback
}

结果状态：

myEntity: {
    ids: {
        0:"test"
    },
    entities: {
        "test": {
            myPayloadTrait: 100
            id: "test"
        }
    }
}

为什么我的prepare回调在将有效负载传递给reducer之前不覆盖"test" id？任何帮助或指导将不胜感激。

Answer 1

prepare回调必须返回一个看起来像{payload?, meta?, error?}的对象。您的代码当前正在直接返回预期的有效负载。

将其更改为：

addEntity: {
  reducer: myEntityAdapter.addOne,
  prepare: (payload) => ({
    payload: {
      ...payload,
      id: uuidv4()
    }
  }),
}

如何在createSlice reducer prepare函数中创建实体ID

1 个答案: