Reactjs:是否有公共(public)API来检查组件是否已安装/卸载

Question

基本上我想把它放在一个组件中:

setTimeout(() =>
{
  if (this.isMounted())  // NOTE: this does not exist
    setState({ foo: 123 });
}, 5000);

但是没有 API 可以实现这一点，我错了吗？

在未挂载的组件上调用 setState() 被视为错误(并在开发模式下由 React 记录此类错误)。

当然，我可以通过设置 this._mounted = false 等在 componentWillUnmount() 中设置自己的状态，但我不喜欢添加私有(private)状态如果不需要的话。

Answer 1

虽然这是 isMounted() 最初创建的确切场景，但当前建议为 usage of isMounted() is bad and will be removed in future React versions .

相反，您应该在卸载组件时检查所有异步函数是否已正确取消。如果您使用setTimeout，则只需保存超时标识符并在componentWillUnmount中取消它就足够了:

this.timeout = setTimeout(() => {
  this.setState({ foo: 123 });
}, 5000);

...

componentWillUnmount() {
  clearTimeout(this.timeout)
}

所以回答你的问题，没有也不应该有用于检查组件是否已安装的 API。这是因为卸载时，应清除对该组件的所有引用，以便垃圾收集器可以将其从内存中删除。