Reactjs 使用React钩子从登录/注册页面重定向已登录用户

我想处理登录用户试图访问登录/注册/任何相关视图时的行为，使用react钩子将此类请求重定向到主页。在我的登录表单组件上，我尝试过类似的方法：

  useEffect(() => {
  if (isAuthenticated) history.push("/dashboard");
     }, [isAuthenticated, history]);

但每次登录用户点击登录时，他/她都会看到登录表单，以便一瞥和一眼，我想阻止它。作为一种解决方法，我使用了

notloggedroote

，它模仿了

PrivateRoute

行为，但我不确定这是否是最好的处理方式：

import React from "react";
import { Route, useHistory } from "react-router-dom";
import { useSelector } from "react-redux";

export const NotLoggedRoute = ({ component: Component, ...rest }) => {
  const isLogged = useSelector(state => state.user.isLogged);
  const history = useHistory();

  return (
    <Route {...rest} render={props =>
    isLogged ?  history.push("/home") :<Component {...props} />
    }
    />
  );
};

从“React”导入React；
从“react router dom”导入{Route，useHistory}；
从“react redux”导入{useSelector}；
export const notloggedroote=（{component:component，…rest}）=>{
const isLogged=useSelector（state=>state.user.isLogged）；
const history=useHistory（）；
返回(
IsLoged？历史记录。推送（“/home”）：
}
/>
);
};

---

我使用的是react router dom v5.1.2、react 16.9和react redux 7.2.0，基本上你的方向是正确的，但是你可以在这里利用react router dom的组件和子组件来处理逻辑并用它包装所有的公共组件：

PublicRoute组件：

从“React”导入React；
从“react router dom”导入{Redirect，Route}；
从'react redux'导入{useSelector}；
const PublicRoute=（{children，…rest}）=>{
const isLogged=useSelector（state=>state.user.isLogged）；
返回(
{
如果（已记录）{
返回；
}
返回儿童；
}}
/>
);
};
导出默认公共路径；

使用：

等等

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

const PublicRoute = ({ children, ...rest }) => {
    const isLogged = useSelector(state => state.user.isLogged);

    return (
        <Route
            {...rest}
            render={() => {
                if (isLogged) {
                    return <Redirect to="/home" />;
                }

                return children;
            }}
        />
    );
};

export default PublicRoute;

<PublicRoute path="/login">
   <Login />
</PublicRoute>

<PublicRoute path="/register">
   <Register />
</PublicRoute>