reactjs - 将对象作为 props 传递会干扰 componentWillReceiveProps 吗？

Question

我的 React 应用程序需要跟踪带有动态键的配置对象，因此我将其传递给如下组件:

<Component configuration={this.state.configuration}>

虽然这有效，但当我在组件的 componentWillReceiveProps(nextProps) 中时，我无法辨别配置更改，因为 this.props 已更新为 nextProps .

如果这不是一个已知问题，也许它与我处理父级配置状态更新的方式有关？以下是我更新配置状态的方法:

  handleConfigurationChangeForKey(newOption, key) {
    const configObject = this.state.configuration;
    configObject[key] = newOption;
    this.setState({configuration: configObject});
  }

预先感谢您的帮助。

Answer 1

I cannot discern configuration changes, because this.props has already been updated to nextProps.

这不是真的。 this.props 将包含当前的 props，nextProps 将包含即将到来的 props。

您设置状态的方式可能是问题所在。尝试使用 Object.create 或深度复制函数(例如 lodash 提供的函数)创建一个新的配置对象。

const newConfig = Object.create(oldConfig)
# or
const newConfig = _.cloneDeep(oldConfig)

newConfig[key] = newValue

这样，该对象将不会通过引用旧版本而相等。如果复制带来性能问题，您可以尝试为状态对象使用 Immutable.js 库。