如何使用react-redux状态处理nextjs路由守卫

Question

我有一个 authState （是一个布尔值），它告诉您用户是否已登录。我有一个与所有组件共享的主布局。 useEffect 中有这个逻辑

  const isLogged = useSelector(selectAuthState);
  const router = useRouter();

  useEffect(() => {
    if (isLogged) {
      router.push('/')
    }else{
      router.push('/login')
    }
  }, [isLogged])

问题是 selectAuthState 的默认值为 false，因此第一次渲染它的值为 false（即使在 localStorage 中 authState 的实际值为 true），在第二次渲染中真正的值来了（它是 true） ，所以我的应用程序总是重定向到“/”路由，因为 authState 的默认值为 false。我如何检查 redux 存储是否“已准备好”或我需要的任何内容以确保我具有实际的 redux 状态？