组件移除

componentWillUnmount()

在从 DOM 卸载组件之前调用此方法。

这是一个执行清洁操作的好地方，例如：

• 删除事件侦听器。
• 清除计时器。
• 停止套接字。
• 清理 redux 状态。

componentWillUnmount(){
  ...
}

在 componentWillUnMount 中删除附加事件侦听器的示例

import React, { Component } from 'react';

export default class SideMenu extends Component {

  constructor(props) {
    super(props);
    this.state = {
        ...
      };
    this.openMenu = this.openMenu.bind(this);
    this.closeMenu = this.closeMenu.bind(this);
  }

  componentDidMount() {
    document.addEventListener("click", this.closeMenu);
  }

  componentWillUnmount() {
    document.removeEventListener("click", this.closeMenu);
  }

  openMenu() {
    ...
  }

  closeMenu() {
    ...
  }

  render() {
    return (
      <div>
        <a
          href      = "javascript:void(0)"
          className = "closebtn"
          onClick   = {this.closeMenu}
        >
          ×
        </a>
        <div>
          Some other structure
        </div>
      </div>
    );
  }
}