Skip to main content

Posts

Showing posts with the label React Lifecycle Components

React Edit Multiples Input Components Example

The input elements often have a property called name, age, mobile, address, and pincode. We can access these properties from the event object that we receive from an event handler. Explore to Understand   -  React Lifecycle Components Write a generalized change handler :      handleChange  = ( event ,  propertyName )  =>  {          const   detail  =  this . state . detail ;          detail [ propertyName ] =  event . target . value ;          this . setState ({  detail:   detail  });     } As an Example, import   React , {  Component  }  from   'react' export   default   class   UserDetail   extends   Component  {      constructor ( props )...

React Unmounting componentWillUnmount Method | Components Lifecycle

The  Unmounting  is used when a component is removed from the DOM. React has only one built-in method that is called when a component is unmounted. 1.        componentWillUnmount The componentWillUnmount Method  - The componentWillUnmount() method is called when the component is removed from the DOM. Explore to Understand   -  React Lifecycle Components As an Example , // container class public   class   Container   extends   React . Component  {    constructor ( props ) {      super ( props );      this . state  = { show:   true };   }    deleteHeader  = ()  =>  {      this . setState ({ show:   false });   }    render () {      let   header ;   ...