安全地反应SetState - 反模式还是好的实践？

Question

我最近遇到了

“只能更新已安装或正在安装的组件。”

在进行异步获取调用后尝试设置状态时出现错误消息。发生这种情况是因为在 http 响应返回之前组件已被卸载。

然后我开始谷歌搜索，找到了问题的解决方案。

如果一个变量保持“已安装”状态，并且每次我想更新状态时，我只需检查该变量怎么办？就像 safeSetState() 函数一样？

这是一个例子：

componentDidMount = () => {
  this._mounted = true;
}

componentWillUnmount = () => {
  this._mounted = false; 
}

safelySetState = (obj) => {
  if(this._mounted)
    this.setState(obj);
}

然后，每次我想更新状态时，我都会使用 this.safelySetState() 函数。

所以我的问题是：为什么我不应该这样做？为什么 React 中还没有默认这个？

Answer 1

我猜测它在 React 中不是默认的，因为它超出了它们的范围。如果状态无法设置，那么他们默默地什么也不做，那就不太好了。相反，他们抛出一个错误是合乎逻辑的，这样他们就让你知道它无法完成，并让你决定如何处理它。

此外，出于同样的原因，我会谨慎地始终使用您的函数...它可能会使调试您的应用程序变得有点困难和晦涩...可能您应该在外部实现它，而不是作为函数...而是与其余代码，仅用于真正需要它的边缘情况......或者至少在组件不可用时记录警告