react组件的生命周期

生命周期图

Mounting：创建虚拟DOM，渲染UI

Updating：更新虚拟DOM，重新渲染UI

Unmounting：删除虚拟DOM，移除UI

第一阶段：初始化

//初始化组件 state
constructor(props: Props) {
    super(props);
    this.state = {
      robotGallery: [],
    };
}
//在组件树创建好dom元素以后，挂载进页面的时候调用
componentDidMount() {
    fetch("https://jsonplaceholder.typicode.com/users")
      .then((res) => res.json())
      .then((data) => this.setState({ robotGallery: data }));
}

第二阶段：更新

//组件更新时调用
componentDidUpdate(){}

第三阶段：销毁

//组件销毁时调用
componentWillUnmount(){}