javascript - 不同类别的状态变化(不 react )

Question

我有两个类

一是 react 组件，二是标准类(验证)。

在 Validation 类中添加为 react 状态中的元素。

state.formValidator = new FormValidation({id: 'install'});
   this.setState(state);

FormValidation 类作为属性具有输入验证类。当某些输入被更新时，FormValidation isValid 属性也会被更新。

在我的 react 组件中我可以看到它。例如，当我在输入元素上添加事件时。更新后，我调用函数来显示 state.formValidator

isValid 属性值正确。但我无法强制 react 自动检测到这种变化。

当

this.state.formValidator.isValid

值正在被其他类/组件更改，我无法在我的 React 组件中检测到此更改。

方法 componentWillUpdate 或 componentWillReceiveProps 是沉默的。

如何强制更新此组件？

我知道我可以为每个输入事件添加 onUpdate，然后更新我的 React 组件。但更好的方法是使用它而不为每个输入触发。

这可能吗？

Answer 1

React 通过简单的 === 检查来检查状态变化。因此，如果您只是更改状态中对象内的属性，它不会重新渲染，因为对象通过引用相等性进行比较，并且更改对象内的属性不会更改其引用 ID。

因此，在您的状态中放置对象通常不是一个好主意 - 您的状态应该是平坦的。

您可以通过调用 this.forceUpdate() 来强制组件在特定条件发生时渲染。从您的组件中获取，但除非非常需要，否则不鼓励这样做。

第二个选项是让组件的渲染状态取决于您的 formValidator.isValid 属性，或者将您的 formValidator 保留在其他地方并且仅保留 isValid 属性被复制到您的状态。