Question

如果未经授权，我需要将用户重定向到身份验证页面。重定向工作正常。

所以问题是如何将所有内容重定向到一个页面，而不是重定向该页面的子页面？

例如，我需要将用户重定向到“ / auth”，然后在他们内部可以转到“ / auth / signin”或“ / auth / signup”。

这是我的代码，它始终重定向到'/ auth'

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

const AuthView = () => {
     const {path} = useRouteMatch();
     return (
       <Switch>
          <Route path={`${path}/signup`}>
             <SignUp/>
          </Route>
          <Route path={`${path}/signin`}>
             <SignIn/>
          </Route>
          <Route path={`${path}/signout`}>
             <SignOut/>
          </Route>
       </Switch>
     );
}
const App = () => {
   return (
      <Router>
         <Switch>
            <Route path="/auth">
               <AuthView/>
            </Route>
            <Redirect from="*" to="/auth"/>
         </Switch>
      </Router>
   );
}

更新：我用这个拐杖解决了，但是我不确定，这是解决它的正确方法吗？

<Route render={(params) => { 
    if(params.location.pathname.match(/(\/auth)/)) {
       return;
    }
    return <Redirect to="/auth/signin/"/>
}}>

如何重定向顶级路由而不重定向子路由？

0 个答案: