Обновите вложенный объект, сохранив остальное таким же

Question

Я начинаю с избыточности, и я хочу сделать следующую модификацию моего состояния:

Из этого:

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

К этому:

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

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

Это const modifEmployee = {...state.byId["employeeID1"], data: data} даст мне измененного сотрудника с данными.

Но как я могу добавить измененного сотрудника в byId, в то же время поддерживая остальных без изменений?

Answer 1

Вы можете сделать что-то подобное, используя синтаксис распространения:

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

Если значение "employeeID1" выбрано из переменной employeeId, то вы можете использовать вычисляемые имена свойств :

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