Amit W3Dev
Amit W3Dev

Reputation: 9

state are being updated before reducer is update the state

I'm using userReducer to manage user state across the app but while updating the state using reducer the state is updates before reducer is able to update it.

Inspect

here you can see that the previous state variable is updated to new value in payload.

store.js

import { compose, applyMiddleware } from "redux";
import { legacy_createStore as createStore } from "redux";


import { logger } from "redux-logger";
import { rootReducer } from "./rootReducer";


export const store = createStore(rootReducer,applyMiddleware(logger));

rootReducer.js

import { combineReducers } from "redux";
import { postReducer } from "./posts/posts.reducer";
import { userReducer } from "./user/user.reducer";

export const rootReducer = combineReducers({
  post: postReducer,
  user:userReducer
});

userReducer

import { User_Action_Types } from "./user.types";

const INITIAL_STATE = {
  data: {
  _id: "",
  name: "",
  email: "",
  password: "",
},
};

export const userReducer = (state = INITIAL_STATE, action) => {
  const { type, payload } = action;
  console.log({ action, state });
  switch (type) {
    case User_Action_Types.SetUser: {
      state.data = payload;
      return state;
    }
    case User_Action_Types.ResetUser: {
      return INITIAL_STATE;
    }

    default:
      return state;
  }
};

I tried to change actions then reinstalled the modules but nothing worked. Please help to fix the issue.

Upvotes: 0

Views: 34

Answers (1)

Ronak
Ronak

Reputation: 419

current your mutating state return new state in reducer

case User_Action_Types.SetUser: {
      
      return {
             ...state,
             data: payload
      };
    }

Upvotes: 2

Related Questions