标签:
React components have a lifecycle, and you are able to access specific phases of that lifecycle. This lesson will introduce mounting and unmounting of your React components.
import React from ‘react‘; import ReactDOM from ‘react-dom‘; export default class App extends React.Component { constructor(){ super(); this.state = { val: 0 } } update(){ this.setState({ val: this.state.val + 1 }) } componentWillMount(){ console.log("Component Will Mount"); } render() { console.log("rendering"); return ( <div> <button onClick={this.update.bind(this)}>{this.state.val}</button> </div> ) } componentDidMount(){ console.log("Component Did Mount"); } }
"componentWillMount" happen before rendering, "state" and "props" are ready, but DOM is not rendered yet.
"componentDidMount" happen after component rendered to the DOM, can access DOM Node.
[React Fundamentals] Component Lifecycle - Mounting Basics
标签:
原文地址:http://www.cnblogs.com/Answer1215/p/5774888.html