react state mutation issue

Question

Im doing a cart on React but i have this lines on a reducer function:

state.cartItems.push({
      ...action.payload,
      quantity: 1,
    });

previous lines causes undesired behaviors.

my understanding its that must'n do a mutations on the state, so i try this instead:

state.cartItems.concat({
      ...action.payload,
      quantity: 1,
    });

and not working

I got the idea from Learning React 2 by Alex Banks and Eve Porcello, the show this example:

let list = [{ title: "Rad Red" }, { title: "Lawn" }, { title: "Party Pink" }];

const addColor = (title, array) => array.concat({ title });

console.log(addColor("Glam Green", list).length); // 4
console.log(list.length); // 3”

Though that this would work but don't do anything

For more live version of the app its here

and for the specific file go here

Answer 1

Im doing a cart on React but i have this lines on a reducer function:

state.cartItems.push({
      ...action.payload,
      quantity: 1,
    });

previous lines causes undesired behaviors.

my understanding its that must'n do a mutations on the state, so i try this instead:

state.cartItems.concat({
      ...action.payload,
      quantity: 1,
    });

and not working

I got the idea from Learning React 2 by Alex Banks and Eve Porcello, the show this example:

let list = [{ title: "Rad Red" }, { title: "Lawn" }, { title: "Party Pink" }];

const addColor = (title, array) => array.concat({ title });

console.log(addColor("Glam Green", list).length); // 4
console.log(list.length); // 3”

Though that this would work but don't do anything

For more live version of the app its here

and for the specific file go here