在卸载组件之前是否真的有必要清除计时器?

时间:2017-07-18 06:05:11

标签: reactjs

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

1 个答案:

答案 0 :(得分:3)

假设你在某个函数中调用timer,当你导航到另一个组件并且当前组件有unmounted时,如果你没有清除计时器,你的函数将继续执行。 / p>

因此,在componentWillUnmount函数中,您需要清除计时器,该计时器可由setInterval

返回的数值标识

如React DOCS中所述:

  在组件出现之前立即调用

componentWillUnmount()   未安装和销毁。在此方法中执行任何必要的清理,   例如使计时器无效,取消网络请求或清理   up在componentDidMount

中创建的任何DOM元素

示例:

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

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

<强> SideEffect:

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