请帮帮我。我有2个redux/toolkit的createSlice方法创建的reducers。
user.reducer.js
import { createSlice } from '@reduxjs/toolkit';
const initialState = {
id: 123,
name: 'Owner123',
cats: [],
};
const reducer = createSlice({
name: 'user',
initialState,
reducers: {
addCat: (state, action) => {
state = {
...state,
cats: [...state.cats, action.payload],
};
return state;
},
feedCat: (state, action) => {
// call eat method from catReducer
},
},
});
export const { addCat, feedCat } = reducer.actions;
export const userReducer = reducer.reducer;
cat.reducer.js
import { createSlice } from '@reduxjs/toolkit';
const initialState = {
id: null,
name: null,
age: null,
color: null,
foodLevel: null,
healthLevel: null,
weight: null,
};
const reducer = createSlice({
name: 'cat',
initialState,
reducers: {
createCat: (
state,
{
payload: {
id,
name,
age,
color,
foodLevel,
healthLevel,
weight,
},
}
) => {
state = {
id: id,
name,
age,
color,
foodLevel,
healthLevel,
weight,
};
return state;
},
eat: (state, action) => {
console.log('hello from cat');
},
},
});
export const { createCat, eat } = reducer.actions;
export const catReducer = reducer.reducer;
我的问题是:如何在user reducer中调用cat reducer中的方法?
我已经尝试了StackOverflow中的一些指南,比如catReducer.caseReducers.eat(),但它不起作用。
发布于 2021-10-09 18:49:44
您所描述的是不可能的,但是您可以做的是,在cat
上创建一个reducer,它在user
中定义的操作上触发。
您可以通过在cat
上使用extraReducers
来完成此操作。它允许您定义一个缩减程序,该缩减程序不会生成操作,但会对导入的现有操作执行操作。
来自文档:https://redux-toolkit.js.org/api/createslice#extrareducers
Redux的关键概念之一是每个切片reducer“拥有”其状态切片,并且多个切片reducer可以独立地响应相同的操作类型。extraReducers允许createSlice响应除了它生成的类型之外的其他操作类型。
由于使用extraReducers指定的案例缩减程序旨在引用“外部”操作,因此它们不会在slice.actions中生成操作。
https://stackoverflow.com/questions/69509266
复制相似问题