将更新的值传播到对象中会删除未修改的属性

时间:2018-12-10 15:30:36

标签: javascript reactjs ecmascript-6

我正在Redux上开发一个reducer,当尝试通过将先前的对象和已更新的对象散布到一个新对象中来更新对象时,会删除未更新的属性。

代码将对其进行更好的解释:

上一个对象:

previousObj: {
    name: 'Foo',
    category: 'Bar',
    projects: [{...}, {...}]
}

更新对象:

updateObj: {
    name: 'Not Foo',
    category: 'Not Bar'
}

然后将二者传播到一个新的容器中

return {
    ...previousObj,
    ...updateObj
}

结果与updateObj相同,这意味着其中包含更多对象的“ projects”属性已消失。据我了解,当将两个对象散布到一个新对象中时,如果后一个属性使用相同的名称,则后一个属性将覆盖前一个属性,但未更改的属性应保持不变。

我在这里想念东西吗?

为清楚起见,下面是实际代码的快照:

Actual code

第12行上的日志具有与previousObj完全相同的形状,第13行上的日志具有与updateObj相同的形状,为简单起见,仅更改了实际值。 结果是更新后我无法再访问“项目”。

任何想法都将不胜感激!

1 个答案:

答案 0 :(得分:0)

我认为您的代码将以这样的结尾:

我能想到的是您的spread object正在正确创建,您是否尝试过将该对象分配给变量然后返回它?这样做的目的是要检查是否创建了正确的键/值。

const previousObj = {
  name: 'Foo',
  category: 'Bar',
  projects: [{
    t: 'test1'
  }, {
    t: 'test2'
  }]
}

const updatedObj = {
  name: 'not Foo',
  category: 'not Bar'
}

const newObj = { 
  ...previousObj,
  ...updatedObj
}

console.log(newObj)

我还可以假设您的updatedObj已损坏,因此您的传播对象有问题,请检查updateObj是否没有为projects键分配内容,如下例所示。

const previousObj = {
  name: 'Foo',
  category: 'Bar',
  projects: [{
    t: 'test1'
  }, {
    t: 'test2'
  }]
}

const updatedObj = {
  name: 'not Foo',
  category: 'not Bar',
  projects: undefined
}

const newObj = { 
  ...previousObj,
  ...updatedObj
}

console.log(newObj)

最后一个是在您返回扩展对象(将完成)之后的某个位置,您正在删除或覆盖密钥。