Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Why is a Component Re-Rendering done when changing the value of the props sent to child Component (react js)?

I am having a problem understanding Rerender in React
I read in the documentation that the Renderer occurs when there is a change in the state
I also read in this article that (https://blog.logrocket.com/a-guide-to-usestate-in-react-ecb9952e406c/) when I pass props to another component and then receive the rubes with a ballistic outside the useEffect, when a change occurs in the value of the props, the change will not be reflected in the component that receives the props.
But when the value of the props is received in a normal variable when there is a change in the value of the props, it performs a rerender and the change is reflected immediately
See this example <<https://codesandbox.io/s/blissful-chatelet-xxb34?file=/src/App.js>>
Please clear this up for me, thank you

>Solution :

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

When will a Component Re-render

  1. When the value of any of its state changes (Class or Functional Component)
  2. When the value of the props that is send by Parent changes (Class of Functional Componnent).

So, this is the basic concept of re-render!

Exceptions

You might decide that if the props that are being sent by parent, are NOT used in your component, in that case you might decide to make your component as PURE COMPONENT, and only in that case the changes in props won’t rerender your child-component!

Also Read: Why React's PureComponent is recommended to have all its children "pure"

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading