美文网首页
React的生命周期

React的生命周期

作者: SnoopPanda | 来源:发表于2019-08-20 14:05 被阅读0次
    import React, { Component } from 'react';
    
    class App extends Component {
      componentDidMount () {
        console.log('4: componentDidMount');
      }
      componentWillMount () {
        console.log('2: componentWillMount');
      }
      shouldComponentUpdate () {
        console.log('a: shouldComponentUpdate');
        return true;
      }
      componentWillUpdate () {
        console.log('b: componentWillUpdate');
      }
      componentDidUpdate () {
        console.log('d: componentDidUpdate');
      }
      constructor () {
        super();
        this.state = {
          num : 1
        }
        console.log('1: constructor');
      }
      render() {
        console.log('c: 3: render');
        return (
          <div>
            {this.state.num }
            <button onClick={ e=> { this.setState({ num : 99})}}>更新数据</button>
          </div>
        );
      }
    }
    
    export default App;
    

    相关文章

      网友评论

          本文标题:React的生命周期

          本文链接:https://www.haomeiwen.com/subject/yxprsctx.html