title: React routing seems to work but it doesn't render the page
body: <p>when I click on the button the URL changes and  it prints 'user exists' in the console, but the page is blank and doesn't show the component. I have been trying to figure out the problem for 2 days now but I can't seem to find a solution and hopefully someone here can help.
  This is the code:</p>
  <pre><code>
  import { Fragment, useState } from &quot;react&quot;;
  import { Route, Link, useHistory } from &quot;react-router-dom&quot;;
  import LoggedUser from &quot;../pages/LoggedUser&quot;;
  
  const ExitingUserButton = () =&gt; {
      const [existingUser, setExistingUser] = useState(false);
      let history = useHistory();
  
      const loginHandler = () =&gt; {
          setExistingUser(true);
          console.log('user exists');
          history.push('/logged-user');
      };
  
      return (
          &lt;Fragment&gt;
              {!existingUser ?
                  &lt;Link type='Link' onClick={loginHandler} to='/logged-user'&gt;  existing user &lt;/Link&gt;
                  :
                  &lt;Route path='/logged-user' exact&gt;
                      &lt;LoggedUser /&gt;
                  &lt;/Route&gt;
              }
          &lt;/Fragment&gt;
      )
  }
  export default ExitingUserButton;
  
     
  </code></pre>
  <pre><code>import { Fragment } from &quot;react&quot;;
  
  const LoggedUser = () =&gt; {
      return (
          &lt;Fragment&gt;
              &lt;h1&gt;Hello, user!&lt;/h1&gt;
          &lt;/Fragment&gt;
      );
  };
  
  export default LoggedUser;
  </code></pre>