React的setState()

setState 通过引发一次组件的更新过程来引发重新绘制

setState 方法被调用时,会引起 React 的 4 个生命周期的函数被调用:

    shouldComponentUpdate (this.state 没有得到更新)
    componentWillUpdate (this.state 没有得到更新)
    reader (this.state 得到更新)
    componentDidUpdate
 

import React, { Component } from 'react';
import './App.css';

class App extends Component {
  constructor(porps) {
    super(porps);
    this.state = {
      firstName: 'xu',
      lastName: 'tongbao'
    };
  }
  shouldComponentUpdate() {
    console.log('shouldUpdate:');
    console.log(this.state);
    return true;
  }
  componentWillUpdate() {
    console.log('willUpate:');
    console.log(this.state);
  }
  componentDidMount() {
    this.setState({firstName: 'li'});
    this.setState({lastName: 'lei'});
  }
  render() {
    console.log('render:');
    console.log(this.state);    
    return (
      <div className="App">
        <div>{this.state.firstName + ' ' + this.state.lastName}</div>
      </div>
    );
  }
}

export default App;
原文地址:https://www.cnblogs.com/xutongbao/p/10003200.html