在代码中，每当session或路由器的值发生变化时（useEffect的第二个参数）都会执行useEffect。因此，if和else并没有在useEffect的同一次运行中执行，尽管是在两次不同的运行中执行的，这两次运行可能是快速连续执行的。
这里有一个方法可以实现你所追求的。
1.使用useState创建和管理变量的状态
1.在useEffect中，通过应用逻辑检查会话来设置状态（或不设置状态）
1.在返回中呈现当前页面或显示登录页面。
示例实现：

const App = (props) => {
  const [isLoggedIn, setIsLoggedIn] = useState(false);
  
  useEffect(()=>{
    //apply the logic and set the state
    if(logic) setIsLoggedIn(true);
  },[]) 
  
  return  {isLoggedIn ? <ActiveApp /> : <Login />}

}

我终于找到了根本原因。
它来自于supabase auth helper的useSession钩子，它是一个异步函数，它不包括正在加载或错误的状态，这意味着它在开始时总是空的（这意味着它正在加载）。
解决这个问题的简单方法，是直接使用useSessionContext。session仍将以异步方式获得，但isLoading和error状态可以以同步方式获得以解决此问题，并且它们可以用于useEffect内部的条件分支。
新代码将是这样的：

import { useSessionContext } from '@supabase/auth-helpers-react'
  const {isLoading, session} = useSessionContext()
  useEffect(() => {

    if (isLoading) {
      console.debug('show loading page')
    }
    else if (session) {
      console.debug('stay in page')
    } 
    else {
      console.debug('goto login')
      router.push('/login').then(
        () => {
          console.debug('goto login done')
        }
      )
    }
  }, [session, isLoading, router])