使用Object.assign更新嵌套对象

fsc*_*ore 3 javascript ecmascript-6 reactjs redux react-redux

我有以下对象.当用户单击按钮时,将为此对象分配新值.

state = {
  title: '',
  id: '',
  imageId: '',
  boarding: {
    id: '',
    test: '',
    work: {
      title: '',
      id: ''
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

我更新的对象如下:

state = {
  title: 'My img',
  id: '1234',
  imageId: '5678-232e',
  boarding: {
    id: '0980-erf2',
    title: 'hey there',
    work: {
      title: 'my work title',
      id: '456-rt3'
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

现在我想更新状态中的工作对象并保持一切相同.Object.assign()当对象没有嵌套但是对于嵌套感到困惑时我正在使用.

Object.assign({}, state, { work: action.work });
Run Code Online (Sandbox Code Playgroud)

我的action.work有整个工作对象,但现在我想把它设置为登机但是这取代了登机中的所有东西,这不是我想要的.

dhi*_*ilt 9

您应手动合并深层对象属性,请尝试以下操作:

Object.assign({}, state, { 
  boarding: Object.assign({}, state.boarding, {
    work: action.work
  }
});
Run Code Online (Sandbox Code Playgroud)

或与传播运营商

{
  ...state,
  boarding: {
    ...state.boarding,
    work: action.work
  }
}
Run Code Online (Sandbox Code Playgroud)