如何解决ReactJS Auth组件不能正常重定向（附代码）

我已经创建了这个Auth 组件，它工作正常，除了，如果未经认证的用户试图访问/dashboard ，它不会重定向。

后台在收到/api/me 请求时，通过cookie知道用户。所以我有（Cookie-Session）认证技术：

export const UserContext = createContext();

const Auth = ({ children }) => {
  const [user, setUser] = useState(null);
  const [gotUser, setGotUser] = useState(false);

  const navigate = useNavigate();

  const getUser = async () => {
    const res = await fetch('/api/me');
    const data = await res.json();
    setUser(data);
    if (user) {
      setGotUser(true);
    }
  };

  useEffect(() => {
    if (!gotUser) {
      getUser();
    }
  }, [user, gotUser, navigate]);

  if (!user) {
    navigate('/login');
  }
  console.log(user);

  return <UserContext.Provider value={user}>{children}</UserContext.Provider>;
};

因此，主要的问题是没有做重定向。而且，传递给上下文的user 也没有正确更新。也许是因为我对在useEffect 中使用什么感到困惑。

希望得到任何帮助。