redux 工具包减速器具有多个参数?还原工具包

Bas*_*Bas 11 reactjs react-redux redux-toolkit

鉴于这种

export const slice = createSlice({
    name: 'reducer',
    initialState: {

    },
    reducers: {
       test: (state, action) => {
           console.log(action.payload) // 1
       } 

    },

})
Run Code Online (Sandbox Code Playgroud)

然后我运行这个

dispatch(test(1,2,3,4,5,6,7)) 
Run Code Online (Sandbox Code Playgroud)

action.payload只是第一个参数。怎样才能得到另外6个呢?

Gab*_*oli 10

阅读相关文档

默认情况下,生成的操作创建者接受单个参数,该参数变为action.payload。这需要调用者正确构造整个有效负载并将其传入。

所以你可以调用这个动作

dispatch(test([1,2,3,4,5,6,7])) 
Run Code Online (Sandbox Code Playgroud)

这样,有效负载现在将是您传递的数组。


但是,如果您需要能够使用多个参数调用它,则可以使用prepare回调

如果您想向操作添加meta或属性,或者自定义操作的,则必须使用该表示法。errorpayloadprepare

dispatch(test([1,2,3,4,5,6,7])) 
Run Code Online (Sandbox Code Playgroud)

这样,您调用操作的原始方式将再次产生一个数组的有效负载,其中将包含您传递的所有参数,无论其数量如何。


Riy*_*iya 5

是的,我们可以在 redux reducer 中发送多个参数,但是在包装到单个对象中之后。单个对象参数可以是数组或 JSON 对象。

// as an array
dispatch(test(["first","second","third"]));
// as a JSON object
dispatch(test({ first:1, second:2, third:3 }));
Run Code Online (Sandbox Code Playgroud)

你的结果会是这样的。

export const slice = createSlice({
name: 'reducer',
initialState: {

},
reducers: {
   test: (state, action) => {
     console.log(action.payload) // ["first","second","third"]
     // or in case of JSON object
     console.log(action.payload) // { first:1, second:2, third:3 }
   } 

},

})
Run Code Online (Sandbox Code Playgroud)