Update a nested object while maintaining the rest the same

Question

I'm starting with redux, and I want to do the following modification to my state:

From this:

state = {
  loaded: true,
  fetching false,
  byId: {
    "employeeID1": {
      id: "employeeID1",
      name: "Steve"
     },
    "employeeID2": {
      id: "employeeID2",
      name: "Susan"
     }
  }
}

To this:

{
  loaded: true,
  fetching false,
  byId: {
    "employeeID1": {
      id: "employeeID1",
      name: "Steve",
      data: data  // <---- add a new property

     },
    "employeeID2": {
      id: "employeeID2",
      name: "Susan"
     }
  }
}

This const modifEmployee = {...state.byId["employeeID1"], data: data} will give me the modified employee with the data.

But, how can I add the modified employee in byId while mantaining the others unchanged?

adiga · Accepted Answer · 2019-03-04 08:50:27Z

3

You could do something like this using spread syntax:

{
  ...state,
  byId: {
    ...state.byId,
    employeeID1: { ...state.byId.employeeID1, data }
  }
}

If "employeeID1" value is a fetched from a variable employeeId, then you could use computed property names:

{
  ...state,
  byId: {
    ...state.byId,
    [employeeId]: { ...state.byId[employeeId], data }
  }
}

edited Mar 4, 2019 at 8:50

answered Mar 4, 2019 at 8:43

adiga

35.4k9 gold badges65 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ana Laura T. Over a year ago

Thank you!, the second example works perfect in my case. If I've understood correctly, I need to use the spread operator on every "level"

adiga Over a year ago

@Ana you're welcome. Also, forgot to mention this. You don't need to do data: data if the variable name and the property name you're adding are the same. That's why just adding data works here. Shorthand property names

Collectives™ on Stack Overflow

Update a nested object while maintaining the rest the same

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related