React Redux Toolkit does not add object into a state array-CodePudding

I am redux beginner and I am using Redux Toolkit to create a reducer.

My initialState variable is:

const initialState = {
  value: [],
  status: 'idle',
};

Then I create a slice with this reducer in it:

reducers: {
    add: (state, action) => {
      state.value.push (0);    // This works (pushing a number)
      state.value.push ("");   // This works also (pushing a string)
      state.value.push ([]);   // This works also (pushing an array)
      state.value.push ({});   // This FAILS (pushing an object)
    },
}

The error message browser gives when trying to push an object into the state array:

Error: Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead.

I want to indeed push an object into the state. What I am doing wrong? Does this has something to do with that, that you can't output an object variable as such inside expression? i.e.

const person = {name: "bill"};

<div>{person]</div> //error?
<div>{person.name}</div> //ok

CodePudding user response：

The problem was solved. The object push indeed works. The problem was not a redux toolkit but a react problem. I had indeed {state] expression in my react code, and that was that caused the problem, not redux toolkit.

Code:

const cart = useSelector(selectCart);

<div>{cart]</div>

So no problem with the Toolkit.