相关疑难解决方法(0)

如何使用react-router-dom创建受保护的路由?

如何使用 localStorage 创建受保护的路由并将react-router-dom响应存储在 localStorage 中,以便当用户下次尝试打开时可以再次查看其详细信息。登录后,他们应该重定向到仪表板页面。

所有功能都添加到 ContextApi 中。Codesandbox 链接:代码

我尝试过但没能实现

路线页面

import React, { useContext } from "react";
import { globalC } from "./context";
import { Route, Switch, BrowserRouter } from "react-router-dom";
import About from "./About";
import Dashboard from "./Dashboard";
import Login from "./Login";
import PageNotFound from "./PageNotFound";

function Routes() {
  const { authLogin } = useContext(globalC);
  console.log("authLogin", authLogin);

  return (
    <BrowserRouter>
      <Switch>
        {authLogin ? (
          <>
            <Route path="/dashboard" component={Dashboard} exact />
            <Route exact path="/About" component={About} /> …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-router react-router-dom

21
推荐指数
2
解决办法
3万
查看次数