状态值不改变，当调度到另一个减少在redux

Question

我正在构建登录系统。当我使用选择器函数时，我有存储状态值的问题。在我的系统中，我想从存储状态值

中获取isSuccess, error, userInfo/login/index.js

const userLogin = useSelector((state) => state.userLogin);
console.log(userLogin);
const { isSuccess, error, userInfo } = userLogin;

如果错误，它将在UI上显示错误消息，否则如果是isSuccess，它将显示成功消息。当post到api成功时出现isSuccess(它意味着用户登录成功)，并且用户数据被分派到loginSuccess减少，否则分派到loginFail的错误值减少

/action/userAction.js

import {
loginSuccess,
loginFail,
} from "~/redux/user/userLoginSlice";
export const login = (inputs) => async (dispatch) => {
try {
const {data} = await request.post("/auth/login", inputs);
dispatch(loginSuccess(data));
localStorage.setItem("userInfo", JSON.stringify(data));
} catch (error) {
console.log(error.response.data)
dispatch(loginFail(error.response.data))
}

。然而，而不是仅仅在loginsuccesreduce中获得isSuccess，它也会在之前的登录是loginFail时获得错误console.log (userLogin)。它应该只显示userInfo和isSuccess。有人能帮我解决这个问题吗?这是

userLoginSlice.js

import { createSlice } from '@reduxjs/toolkit';

const userLoginSlice = createSlice({
name: 'userInfo',
initialState: {},
reducers: {
loginSuccess: (state, action) => {
state.isSuccess = true;
state.userInfo = action.payload;
},
loginFail: (state, action) => {
state.error = action.payload
},
},
});
export const { loginSuccess, loginFail } = userLoginSlice.actions;
export default userLoginSlice.reducer;

and my reduce store

store.js

import { configureStore } from '@reduxjs/toolkit';
import productModalReducer from './product-modal/productModalSlice';
import cartItemsSlice from './cart/cartSlide';
import userLoginSlice from './user/userLoginSlice.js';
import userRegisterSlice from './user/userRegisterSlice.js';
import userUpdateSlice from './user/userUpdateSlice.js';
const userInfoFromStorage = localStorage.getItem('userInfo') ? JSON.parse(localStorage.getItem('userInfo')) : null;
const initialState = {
userLogin: { userInfo: userInfoFromStorage },
};
export const store = configureStore({
reducer: {
productModal: productModalReducer,
cartItems: cartItemsSlice,
userLogin: userLoginSlice,
userRegister: userRegisterSlice,
userUpdate: userUpdateSlice,
},
preloadedState: initialState,
});

在redux中，当调度减少时，状态值不改变

Answer 1

似乎这可能是因为loginSuccess只将userInfo和isSuccess添加到状态，而不省略先前的error。

也许可以尝试重置状态值，以排除error在减速器:

const userLoginSlice = createSlice({
name: "userInfo",
initialState: {},
reducers: {
loginSuccess: (state, action) => {
// 👇 Reset state to omit error message in loginSuccess
state = { isSuccess: true, userInfo: action.payload };
},
loginFail: (state, action) => {
// 👇 Could add "isSuccess: false, userInfo: null" if needed
state = { error: action.payload };
},
},
});

或者返回一个状态值，而不是使用Immer代理状态:

const userLoginSlice = createSlice({
name: "userInfo",
initialState: {},
reducers: {
loginSuccess: (state, action) => {
// 👇 Reset state to omit error message in loginSuccess
return { isSuccess: true, userInfo: action.payload };
},
loginFail: (state, action) => {
// 👇 Could add "isSuccess: false, userInfo: null" if needed
return { error: action.payload };
},
},
});