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;
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步