componentdidmount react native example

Example 1: react native componentwillmount vs componentdidmount

The best place to make calls to fetch data is within componentDidMount(). 
componentDidMount() is only called once, on the client, compared to 
componentWillMount() which is called twice, once to the server and 
once on the client. It is called after the initial render when the 
client received data from the server and before the data is displayed 
in the browser.

Example 2: set state

class App extends React.Component {

state = { count: 0 }

handleIncrement = () => {
  this.setState({ count: this.state.count + 1 })
}

handleDecrement = () => {
  this.setState({ count: this.state.count - 1 })
}
  render() {
    return (
      <div>
        <div>
          {this.state.count}
        </div>
        <button onClick={this.handleIncrement}>Increment by 1</button>
        <button onClick={this.handleDecrement}>Decrement by 1</button>
      </div>
    )
  }
}

Example 3: component did mmount

componentDidUpdate(prevProps, prevState, snapshot)

Tags:

Misc Example