2

I am trying to dispatching an circular object using dispatch(addClient(conversationsClient)) to the redux toolkit slice once I get the result I can log it but once I assign it the sore I having the issue.

//it's Dumay data to explain my issue
const conversationsClient = [{}];
a[0].a = a;
a.push(a);


const chatSlice = createSlice({
name: 'chatSlice',
initialState: initialState,
reducers: {
    addClient: (state, action: PayloadAction<any>) => {
        console.log("I can see the proper object", action.payload);
        state.client = action.payload; //here I am getting the exception 
    }
}
});

dispatch(addClient(conversationsClient))

I am getting the following result Uncaught (in promise) RangeError: Maximum call stack size exceeded at StateMachine.get [as state] (state-machine.js:575) at trackProperties

enter image description here

I've tried to used the following package : https://www.npmjs.com/package/flatted may any work around to solve this issue because I am looking to use the object in many components

Marwan Al-Masaeid
  • 124
  • 1
  • 10
  • Does this answer your question https://stackoverflow.com/questions/61704805/getting-an-error-a-non-serializable-value-was-detected-in-the-state-when-using? – Lin Du Sep 14 '21 at 06:43
  • The best thing to do is not not store circular data. – Linda Paiste Sep 14 '21 at 15:30

0 Answers0