react-router#Navigate JavaScript Examples
The following examples show how to use
react-router#Navigate.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: App.js From cucoders with Apache License 2.0 | 4 votes |
//eslint-disable-line
export default function App() {
//-----------------------------------------INITIALIZING
// STATES-------------------------//
const [isVerified, updateIsVerified] = useState(false);
//-----------------------------------------CHECK
// AUTHENTICATION------------------------//
useEffect(() => {
axios
.get("https://cucoders.herokuapp.com/auth/user", {
withCredentials: true,
})
.then((res) => {
if (res.data.username) {
updateIsVerified(true);
console.log("Logged In from APP.js");
} else {
updateIsVerified(false);
console.log("Logged Out from APP.js");
}
});
}, []);
return (
<Router>
<Switch>
<Route path="/components/:type/:subtype/:name">
<ComponentRenderer />
</Route>
<Route exact path="/components/:type/:name">
<ComponentRenderer />
</Route>
<Route exact path="/team">
<Team isLoggedIn={isVerified} />
</Route>
<Route exact path="/upcoming">
<Upcoming />
</Route>
<Route exact path="/events">
<Events isLoggedIn={isVerified} />
</Route>
<Route exact path="/present">
<Present />
</Route>
<Route exact path="/past">
<Past />
</Route>
<Route exact path="/projects">
<Projects isLoggedIn={isVerified} />
</Route>
<Route path="/resources">
<Resources isLoggedIn={isVerified} />
</Route>
<Route exact path="/comingnow">
<ComingNow />
</Route>
<Route exact path="/careers">
<Careers isLoggedIn={isVerified} />
</Route>
<Route exact path="/comingsoon">
<ComingSoon />
</Route>
<Route exact path="/coming">
<Coming />
</Route>
<Route exact path="/contact">
<Contact isLoggedIn={isVerified} />
</Route>
<Route path="/backend">
<Back />
</Route>
<Route exact path="/frontend">
<Front />
</Route>
<Route exact path="/fullstack">
<Full />
</Route>
<Route path="/setter">
<Setter />
</Route>
<Route exact path="/tester">
<Tester />
</Route>
<Route exact path="/editorialist">
<Editorial />
</Route>
<Route exact path="/graphic">
<Graphic />
</Route>
<Route exact path="/motion">
<Motion />
</Route>
<Route exact path="/uiux">
<UIUX />
</Route>
<Route exact path="/thanks">
<Thanks />
</Route>
<Route exact path="/calender">
<Calender />
</Route>
<Route exact path="/calender">
<Calender />
</Route>
<Route exact path="/ThankYouSoMuch">
<ThankYouSoMuch />
</Route>
<Route exact path="/privacy">
<Privacy />
</Route>
<Route exact path="/terms">
<Terms />
</Route>
<Route exact path="/member">
<Member isLoggedIn={isVerified} />
</Route>
<Route exact path="/about">
<About isLoggedIn={isVerified} />
</Route>
<Route exact path="/home">
<Home isLoggedIn={isVerified} />
</Route>
<Route exact path="/">
<Home isLoggedIn={isVerified} />
</Route>
<Route exact path="/algo">
<Algo />
</Route>
<Route exact path="/ai">
<AI />
</Route>
<Route exact path="/cp">
<CP />
</Route>
<Route exact path="/Security">
<Security />
</Route>
<Route exact path="/Language">
<Language />
</Route>
<Route exact path="/Database">
<Database />
</Route>
<Route exact path="/VersionControl">
<VersionControl />
</Route>
<Route exact path="/mobile">
<Mobile />
</Route>
<Route exact path="/open">
<Open />
</Route>
<Route exact path="/web">
<Web />
</Route>
<Route exact path="/lostpassword">
<LostPassword />
</Route>
<Route exact path="/login">
{isVerified ? (
<Navigate to="/home" />
) : (
<Login updateIsLoggedIn={updateIsVerified} />
)}
</Route>
<Route exact path="/signup">
{isVerified ? <Navigate to="/" /> : <Signup />}
</Route>
<Route path="/">
<Error />
</Route>
</Switch>
<Lines />
</Router>
);
}