React的生命周期函数的过程

  // 这个是挂载的阶段
      //第一次进去的时候执行  页面挂载之前执行的 （组件在“即将挂载”到页面上的的时候自动执行）
  componentWillUnmount() {
    console.log("componentWillUnmount");
  }
  render() {
    console.log('render');
    return (
      // jsx的语法块
      //Fragment是jsx是占位符
      <Fragment>
       <div>demo</div>
      </Fragment>
    )
  }
  // 这个是挂载的阶段 
      // 第一次进去的时候执行   页面挂载之后执行的
  componentDidMount() {
    console.log('componentDidMount');
  }
  // 更新的阶段
      // 组件更新之前，会自动执行的函数
  shouldComponentUpdate() {
    console.log('shouldComponentUpdate');
    // return false  // 页面不会产生更新 不会执行render函数
    return true  //页面会立即更新，直接执行render函数
  }
  // 更新的阶段
      // 组件更新之前，会自动执行的函数,但是他在shouldComponentUpdate之后执行，如果shouldComponentUpdate为true会执行；如果shouldComponentUpdate为false,不会执行
  componentWillUpdate() {
    console.log('componentWillUpdate');
  }
  // 更新的阶段
      // 组件更新完后之后执行的函数
  componentDidUpdate() {
    console.log('componentDidUpdate');
  }
  // 最后的一个阶段（这个只有在子组件即将移除的时候才能生效）
      // 当组件即将从页面中移除的时候会被执行
  componentWillUnmount() {
    console.log('componentWillUnmount');
  }