class App extends React.Component {
static propTypes = {
};
static defaultProps = {
};
constructor(props) {
super(props);
this.state = {
data: 0
};
}
componentWillUnMount() {
}
componentWillReceiveProps(nextProps) {
}
shouldComponentUpdate(nextProps, nextState) {
return true;
}
componentWillUpdate(nextProps, nextState) {
console.log('准备update')
console.log(this.state.data)
}
componentDidUpdate(prevProps, prevState) {
console.log(this.state.data)
}
componentWillMount() {
console.log(this.state.data)
}
componentDidMount() {
console.log(this.state.data)
this.setState(
{data: 1}
)
console.log(this.state.data)
}
render() {
return <div>This is a demo</div>;
}
}
ReactDOM.render(
<App />,
document.getElementById('example')
)
《深入React技术栈》这本书确实值得推荐。对生命周期的理解,就是自己慢慢打log看,自己琢磨。