使用reduxjs/toolkit为createAction函数添加有效载荷

Question

我如何添加有效载荷createAction从现在的功能?

from this:

import { ADD_ARTICLE } from "../constants/actions-type"
import { createAction } from "@reduxjs/toolkit"
export function addArticle(payload) {
return { type: ADD_ARTICLE, payload }
};

转换成:

export const addArticle = createAction(ADD_ARTICLE, ????)

Answer 1

createAction的第二个参数是一个函数，它接受您的操作创建者的参数并将它们映射到具有payload属性的对象。因为你的动作创建者将整个payload作为参数，所以它是:

export const addArticle = createAction(ADD_ARTICLE, payload => ({payload}));

Answer 2

您不需要做任何事情。createAction的结果是一个操作创建函数，该函数接受一个参数并将其放在payload上。

所以export const addArticle = createAction(ADD_ARTICLE)正是你想要的。

Answer 3

对于TypeScript，向createAction添加泛型类型暗示生成的动作创建者接受PayloadType类型的有效负载:

export const addArticle = createAction<PayloadType>(ADD_ARTICLE)

那么对于payload: PayloadType，您可以

dispatch(addArticle(payload))