cuando hago clic en el botón, la URL cambia e imprime 'el usuario existe' en la consola, pero la página está en blanco y no muestra el componente. He estado tratando de resolver el problema durante 2 días, pero parece que no puedo encontrar una solución y espero que alguien aquí pueda ayudar. Este es el código:
import { Fragment, useState } from "react"; import { Route, Link, useHistory } from "react-router-dom"; import LoggedUser from "../pages/LoggedUser"; const ExitingUserButton = () => { const [existingUser, setExistingUser] = useState(false); let history = useHistory(); const loginHandler = () => { setExistingUser(true); console.log('user exists'); history.push('/logged-user'); }; return ( <Fragment> {!existingUser ? <Link type='Link' onClick={loginHandler} to='/logged-user'> existing user </Link> : <Route path='/logged-user' exact> <LoggedUser /> </Route> } </Fragment> ) } export default ExitingUserButton; import { Fragment } from "react"; const LoggedUser = () => { return ( <Fragment> <h1>Hello, user!</h1> </Fragment> ); }; export default LoggedUser;Debe envolver sus Routes con un Switch . Consulte el documento https://v5.reactrouter.com/web/guides/quick-start
<Router> <div> <nav> <ul> <li> <Link to="/">Home</Link> </li> <li> <Link to="/about">About</Link> </li> <li> <Link to="/users">Users</Link> </li> </ul> </nav> {/* A <Switch> looks through its children <Route>s and renders the first one that matches the current URL. */} <Switch> <Route path="/about"> <About /> </Route> <Route path="/users"> <Users /> </Route> <Route path="/"> <Home /> </Route> </Switch> </div> </Router>