reactjs - 在卸载组件之前真的有必要清除计时器吗？

Question

通常在从 DOM 卸载组件之前会清除计时器。但是如果我们忘记清除计时器会产生什么副作用？

Answer 1

假设您在某个函数中调用计时器，当您导航到另一个组件并且当前组件已卸载时，如果您不清除计时器，您的函数将继续执行。

因此，在componentWillUnmount函数中，您需要清除计时器，该计时器可以通过setInterval返回的数值来识别

正如 React DOCS 中提到的:

componentWillUnmount() is invoked immediately before a component is unmounted and destroyed. Perform any necessary cleanup in this method, such as invalidating timers, canceling network requests, or cleaning up any DOM elements that were created in componentDidMount

示例:

componentDidMount() {
    this.timerID = setInterval(
      () => this.somefunc(),
      1000
    );
  }

  componentWillUnmount() {
    clearInterval(this.timerID);
  }

副作用:

考虑这样一种情况，您在计时器中进行 API 调用，从中获取在组件中显示的数据。现在，如果您离开该组件，即使不需要结果，您通常也不会希望一次又一次地调用 API。这将导致服务器上不必要的负载。