“chroniona trasa w react JS” Kod odpowiedzi

chroniona trasa w react JS

import React from 'react'
import { Redirect, Route } from 'react-router-dom'

const Protected = ({ component, ...rest }) => {
	<Route
		{...rest}
		render={() => {
			localStorage.getItem('login') ? (
				<component {...props} />
			) : (
				<Redirect to='/login' />
			)
		}}
	/>
};
export default Protected


// app.js 
import Protected from'./components/Protected'

<Router>
<Protected exact path="/"component={Home}/>
<Protected exact path="/about"component={About}/>
<Protected exact path="/contact"component={Contact}/>
</Router>
Abhishek

REACT PROGRED PROBLET TROSE

import { Navigate, Outlet } from 'react-router-dom';

const PrivateRoutes = () => {
  const location = useLocation();
  const { authLogin } = useContext(globalC);
  console.log("authLogin", authLogin);

  return authLogin 
    ? <Outlet />
    : <Navigate to="/login" replace state={{ from: location }} />;
}
Fierce Fly

REACT PROGRED PROBLET TROSE

<BrowserRouter>
  <Routes>
    <Route path="/" element={<PrivateRoutes />} >
      <Route path="/dashboard" element={<Dashboard />} />
      <Route path="/about" element={<About />} />
    </Route>
    <Route path="/login" element={<Login />} />
    <Route path="*" element={<PageNotFound />} />
  </Routes>
</BrowserRouter>
Fierce Fly

Odpowiedzi podobne do “chroniona trasa w react JS”

Pytania podobne do “chroniona trasa w react JS”

Więcej pokrewnych odpowiedzi na “chroniona trasa w react JS” w JavaScript

Przeglądaj popularne odpowiedzi na kod według języka

Przeglądaj inne języki kodu