title: useState element not rerendering when triggered by an event handler in a child component
body: <p>I have a parent component with a useState that is being displayed. What I want to do is have a child component be able to update this state to change what the parent is displaying. I currently have the following:</p>
  <pre><code>function Parent() {
  
      const [myWindow, setMyWindow] = useState(null)
   
      useEffect(() =&gt; {
  
          setMyWindow(&lt;Child updateWindowFunc={() =&gt; setMyWindow(someNewWindow)} /&gt;)    
  
      }, []}
  
      return (
          &lt;div&gt;
              {myWindow}
          &lt;/div&gt;
      )
  
  }
  
  
  function Child({updateWindowFunc}) {
      //Somehow calls updateWindowFunc
  }
  </code></pre>
  <p>(Note that my actual code is set up somewhat differently, so don't mind the syntax as much as the general concept.)</p>
  <p>I've found that I can get the value of myWindow to change, but the actual display doesn't show any change. I've tried forcing a re-render after the change, and adding a useRef to display useRef.current, but nothing seems to update which window is actually being rendered.</p>
  <p>What am I doing wrong?</p>
  <p>Edit:
  I've found that it works if I switch to a different type of component, but if its just a different element of the same component then there is no re-render. I've been using React.createElement(), so I would think the 'objects' are distinct, but maybe I just misunderstand how this works.</p>