How do I add a new key/value pairing within an object in Redux state store?

Question

I am buiding a React application with Redux.

In the reducer, how do I add a field within the objects of a list of objects?

For example, my state may look like:

items: [
    {
        name: "Bob",
        age: 25
    },
    {
        name: "Sally",
        age: 17,
    },
    {
        name: "Charles",
        age: 54
    },
    {
        name: "Derrick",
        age: 34
    }
]

How do I make it look like this?

items: [
    {
        name: "Bob",
        age: 25,
        selected: false
    },
    {
        name: "Sally",
        age: 17,
        selected: false
    },
    {
        name: "Charles",
        age: 54
        selected: false
    },
    {
        name: "Derrick",
        age: 34            
        selected: false
    }
]

Basically, I'd like to add a field in an object and apply it for each object in the array.

I've created an action for it and in the reducer, I tried something like

case ADD_FIELD:
    return {
        ...state,
        items: [
            ...state.items,
            ...{
                selected: false
        }
        ],
    };

I really have no idea what the appropriate syntax is or if it's even possible. Any help would be greatly appreciated.

Answer 1

You need to run #array.map on the data and add one more key with each object.

Like this:

case ADD_FIELD:
    return {
        ...state,
        items: state.items.map(el => ({
            ...el,
            selected: false
        }))
    };