【React】组件的生命周期 - 虚拟DOM - DOM Diffing算法

1. 组件的生命周期

1.1 理解

1. 组件从创建到死亡它会经历一些特定的阶段。
2. React组件中包含一系列勾子函数(生命周期回调函数), 会在特定的时刻调用。
3. 我们在定义组件时，会在特定的生命周期回调函数中，做特定的工作。

1.2 引入案例

需求:定义组件实现以下功能：

1. 让指定的文本做显示 / 隐藏的渐变动画
2. 从完全可见，到彻底消失，耗时2S
3. 点击“不活了”按钮从界面中卸载组件

//创建组件
//生命周期回调函数 <=> 生命周期钩子函数 <=> 生命周期函数 <=> 生命周期钩子
class Life extends React.Component{
   

  state = {
   opacity:1}

  death = ()=>{
   
	//卸载组件
	ReactDOM.unmountComponentAtNode(document.getElementById('test'))
  }

  //组件挂完毕
  componentDidMount(){
   
	console.log('componentDidMount');
	this.timer = setInterval(() => {