title: useEffect clean up being called on mounting
body: <p>I have a functional component  react version is 17</p>
  <pre><code>export default function Comp(props){
    .
    .
    .
    useEffect(() =&gt; {
      return () =&gt; {// cleanup
        console.log(&quot;Called!&quot;)
      }
    }, [...dependiences])
  
  }
  
  </code></pre>
  <p>I have another button that mounts and unmounts the component</p>
  <p>for some reason, the clean-up function is getting called on mounting the component</p>
  <p>and I can see the console Log</p>
  <p>How can I prevent this from happening and call the clean up only if the component is un-mounting</p>
  <p>The parent creates the component like this</p>
  <pre><code>  
  export default function Comp(props){
    .
    .
    .
    const [mount, setMount] = useState(false);
  
    return &lt;&gt; {mount &amp;&amp; &lt;Child {...someProps}/&gt;}&lt;/&gt;
  
  }
  
  </code></pre>