当我将它分成另一个组件时，React-router Redirect 似乎不起作用

Question

我正在尝试在我的 React 应用程序中设置 PrivateRoute 组件，但是当我将重定向分离到另一个文件时，如果 Auth 为 false，它似乎不会重定向 - 它只是挂在管理页面上，没有加载任何组件。当我的 App.js 中有 PrivateRoute 函数时，该组件工作正常，但是当我将它分成一个新文件时，react-routers Redirect 似乎不起作用这是函数：import React from 'react';import { BrowserRouter as Redirect, Route } from "react-router-dom";function PrivateRoute({component: Component, ...rest}) {  const isAuth = false;  return (    <Route      {...rest}      render={props =>        isAuth ? (          <Component {...props} />        ) : (          <Redirect            to={{              pathname: "/login",              state: { from: props.location }            }}          />        )      }    />  )}export default PrivateRoute;这是我的路线清单import React, {useState, useEffect} from 'react';import { BrowserRouter as Router, Route, Redirect } from "react-router-dom";import Home from './views/Home';import Players from './views/Players';import Stats from './views/Stats';import Admin from './views/Admin';import Nav from './components/Nav/Nav';import SideNav from './components/SideNav/SideNav';import Login from './views/Login';import PrivateRoute from './components/PrivateRoute/PrivateRoute';function App() {  const [navState, setNavState] = useState(false);  return (    <Router>      <div id="app" className="centurion-major-app d-flex">        <main className="flex-1 main_container">          <Route path="/" exact component={Home} />          <Route path="/players/" component={Players} />          <Route path="/stats/" component={Stats} />          <Route path="/login/" component={Login} />          <PrivateRoute path="/admin/" component={Admin} />        </main>      </div>    </Router>  );}export default App;我知道我可以将 PrivateRoute 函数留在 App.js 中，但我不明白为什么它不起作用？

Answer 1

我认为导入BrowserRouter as Redirect和使用<Redirect to=不起作用，因为BrowserRouter组件是用于完全不同的目的，不要指望to道具。将导入更改为

import { BrowserRouter as Router, Redirect, Route } from "react-router-dom";

应该解决这个问题。