title: How to sync props to state using React hooks : setState()
body: <p>I am trying to set the state using React hook setState() using the props the component receive. I've tried using the below code:</p>
  
  <pre><code>import React,{useState , useEffect} from 'react';
  
  const Persons = (props) =&gt;  {
  
      // console.log(props.name);
  
     const [nameState , setNameState] = useState(props)
  
     console.log(nameState.name);
     console.log(props.name);
  
     return (
              &lt;div&gt;
                  &lt;p&gt;My name is {props.name} and my age is {props.age}&lt;/p&gt;
                  &lt;p&gt;My profession is {props.profession}&lt;/p&gt;
              &lt;/div&gt;
          )
  
  }
  
  export default Persons;
  </code></pre>
  
  <p>The issue is the state is being set upon component being loaded. But when it receive new props, the state is not getting updated. How to update the state in this case? Thanks in advance.</p>