Question

卸载组件时，我的React组件中的状态不会被垃圾收集，从而导致内存泄漏。我在macOS Sierra上的Chrome 10.12.5上使用react@15.5.4。

我在componentDidMount中设置状态，如this。

要确认内存泄漏，我已将以下内容添加到componentDidMount：

let arr = new Uint8Array(1024 * 1024 * 30);
this.setState({
  test: arr
});

并获取堆快照以确认在堆上分配了30MB的Uint8Array。

然后，我已确认该组件已被console.log中的componentWillUnmount卸下。

当我随后获取堆快照时，即使在允许充足的时间进行垃圾收集之后，Uint8Array仍然在堆中。

有关从何处开始调试此问题的任何想法？或者来自源代码的任何观察结果？

Answer 1

根据我的理解，您期望componentWillUnmount作为类析构函数工作，但我认为React组件生命周期以不同的方式工作。

状态之类的对象属性通常位于类构造函数中，然后componentWillMount / componentDidMount和componentWillUnmount仅适用于同一对象。

如果组件不在DOM中，则不意味着它收集了垃圾。当（如果）重新安装它时，将使用相同的对象。

如果对您有任何意义，您可以在state中自行清空componentWillUnmount。在这种情况下，我认为GC将恢复内存。