反应，关于不改变状态

Question

假设我有一个州

state = {
  inner1: {
     inner2: {
        foo: var1
     }
  }
}

我想将foo更新为var2。

我应该创建state inner1 inner2的副本，以便shallowEqual看到state inner1 inner2更改了吗？

在代码中，它将类似于

newState = _.merge({}, state, {
   inner1: {
     innner2: {
        foo: var2
     }
   }
})

（虽然我并不完全确定_.merge是如何工作的，但有时似乎反直觉）

所以，从概念上讲，我创建一个浅拷贝直到（嵌套级别）我找到了我想要改变的对象。

或者仅更新inner2更合适吗？

var { inner2 } = state.inner1

var newInner2 = _.merge({}, inner2, {
    foo: var2
})

state.inner2 = newInner2

Answer 1

您可以只使用点差运算符，而不是使用Lodash。 此示例假定inner1和inner2上的属性多于您的问题中说明的属性。如果没有，差价就完全过时了。

this.setState((prevState) => ({
  inner1: {
    ...prevState.inner1,
    inner2: {
       ...prevState.inner2,
       foo: var2,
    },
  },
}));