1. 程式人生 > 實用技巧 >react宣告週期詳解

react宣告週期詳解

react的生命週期,分為3三個階段,
掛載階段
constructor(){}

UNSAFE_componentWillMount(){}  == componentWillMount(在17版本中將廢除){}

componentDidMount(){ 傳送非同步請求的}

render(){}
==========================================================


跟新:的時候,主要跟新兩個型別的資料。stata,props這兩個型別的資料;

銷燬
import React, { Component } from "react";

export default class Shengming extends Component {
  // 呼叫父類的 constructor方法;傳遞props屬性,染髮props屬性起作用
  constructor(props) {
    super(props);

    // 定義初始值
    this.state = {
      num: 20,
    };
    console.log("1-1我是掛載階段的第一個生命週期函式");
  }
  //   UNSAFE
  UNSAFE_componentWillMount() {
    console.log("1-2掛載資料之前");
  }

  componentDidMount() {
    //   用來發送請求
    console.log("1-4資料已經掛載好了");
  }

  render() {
    console.log("1-3render 標籤渲染到頁面");
    return <div>123==》{this.state.num}</div>;
  }
}