Quick Contact


    React Constructor

    Constructor is a lifecycle method used in both class components and functional components. When you create class constructor is also call with class. With class component we directly use constructor lifecycle method but with functional component hooks are used to use constructor.

    Constructor is important because when you create a class it includes both HTML and render method. So, when we create class the first which is wriiten before any other method is constructor. Super constructor is used to call paid component. Example is as below class component with constructor-:

    		Import ‘./App.css’;
    		Import React from ‘react’
    		Class App extends React.Component{
    		Constructor()
    		{
    		Super();
    		this.state={
    		data=””
    		}}
    		render()
    		{
    		   return (
    		     < h1>Hello World {this.state.data}< /h1>
    		)}}
    		Export default App;
    	

    In Constructor you don’t use lifecycle method directly. You have to use hooks. Constructor is actually a lifecycle method. When you create a class component then html is also used it then first thing which is created is constructor only. So in this code first react is import and then class is defined as-:

    		class App extends React.Component{
    		}
    		So in this you can use render method and return the message as-:”
    		class App extends React.Component{
    		render()	
    		{
    		Return(
    		< h1>hello world< /h1>
    		)
    		}
    		}
    	
    Output is shown as-:
    React constructor

    When you create constructor to call parent constructor super () is used

    		Import logo from ‘./logo.svg’;
    		Import ‘./App.css’;
    		Import React from ‘react’
    		Class App extends React.Component{
    		  Constructor()
    		{
    		Super();
    		}
    		Render()
    		{
    		Return(
    		< h1>Hello World< /h1>
    		)}}
    		Export default App;
    	

    State is defined in constructor to make execution easy.

    Copyright 1999- Ducat Creative, All rights reserved.