import React, { Fragment, useState } from "react"; import "./App.css"; import { BrowserRouter as Router, Routes, Route, Link } from "react-router-dom"; import Home from "./components/Home"; import Login from "./components/Login"; import Register from "./components/Register";aplicación de función () {
const [isAuthenticated, setAuthenticated] = useState(false);aplicación de función () {
const [isAuthenticated, setAuthenticated] = useState(false); return ( <Fragment> <Router> <div className="container"> <Routes> <Route exact path="/login" element={props => !isAuthenticated ? <Login {...props}/> :<Link to="/home" />} /> <Route exact path="/register" element={props => !isAuthenticated ? <Register {...props} /> : <Link to="/login" />} /> <Route exact path="/home" element={props => !isAuthenticated ? <Home {...props} />: <Link to="/login" />} /> </Routes> </div> </Router> </Fragment> );}
exportar la aplicación predeterminada;
function App(props){ //props accessible now to the functional component return( //your code... { !(isAuthenticated)? <Routes> <Route exact path="/login" element={<Login {...props}/>} /> //other unauthenticated routes </Routes> : <Routes> <Route exact path="/login" element={<Link to="/home" />} /> //other authenticated routes </Routes> } ) }