componentdidmount in react native code example

Example 1: react native class component constructor

import React from 'react';  
import { View, TextInput } from "react-native";

class App extends React.Component {  
  constructor(props){  
    super(props);  
    this.state = {  
         name: "" 
      }  
    this.handleChange = this.handleChange.bind(this);  
  }
  handleChange(text){
    this.setState({ name: text })
    console.log(this.props);  
  }  
  render() {  
    return (  
    
      this.handleChange(text)}
      />
      
  }  
}  
export default App;

Example 2: 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 3: lifecycle method react

INITIALIZATION= setup props and state 
MOUNTING= constructor->componentWillMount->render->componentDidMount//Birth
UPDATE= shouldComponentUpdate->componentWillUpdate->render
  		->componentDidUpdate //Growth
UNMOUNTING= componentWillUnmount //Death

Example 4: lifecycles if reactjs

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {date: new Date()};
  }

  componentDidMount() {  }
  componentWillUnmount() {  }
  render() {
    return (
      

        
Hello, world!
        
It is {this.state.date.toLocaleTimeString()}.
      
    );
  }
}

Example 5: react.component

class Welcome extends React.Component {
  render() {
    return 
Hello, {this.props.name}
;
  }
}

Example 6: react lifecycle

constructor(props) {
  super(props);
  // Don't call this.setState() here!
  this.state = { counter: 0 };
  this.handleClick = this.handleClick.bind(this);
}