我们如何在React [关闭]中从DOM中删除一个组件

Question

我何时可以在React代码中使用以下方法？componentWillUnmount()

请显示一个例子。

Answer 1

“何时可以在我的React代码中使用以下方法？componentWillUnmount（）”：

我们想在第一次将时钟呈现给DOM时设置一个计时器。这在React中称为“安装”。

我们还希望清除Clock产生的DOM时清除该计时器。这在React中称为“卸载”。

componentDidMount（）方法在将组件输出呈现到DOM之后运行。这是设置计时器的好地方：

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

我们将在componentWillUnmount（）生命周期方法中拆除计时器：  componentWillUnmount() {
    clearInterval(this.timerID);
  }

基本上是componentWillUnmount（）方法，只要您需要做一些事才能丢弃当前看到的DOM，就可以使用。在这种情况下，时钟将从DOM中删除，因此您想在发生这种情况之前停止计时器。

您可以在此处阅读有关生命周期方法的更多信息：https://reactjs.org/docs/state-and-lifecycle.html

Answer 2

如果您打算删除组件或元素，则应通过条件渲染来完成，因此，请更改渲染组件的状态。