SetState 更新但不保存

Question

下面是我的代码，我正在尝试 setState 一个字符串全局上下文值， 字符串本身存在，不属于变量数组， 当我单击登录时，我可以看到包含全局值 login.loggedin 的 h1 按请求更新为 true，但是当登录完成并且 auth0 重定向回应用程序时，该值不再更改为 login 并返回 false， 在我遵循的教程中，https://www.youtube.com/watch?v=35lXWvCuM8o Dev ed 谈到使用 prevState 来确保它正确分配值， 但是我不确定如何将 prevState 用于字符串而不是他在示例中使用的数组，有人可以向我解释设置状态如何显示为工作但不保存和可能的修复吗？我什至将 loginwithredirect 放在设置状态之后，但是否有可能在状态更改完成处理之前发生 loginwithredirect？

import React, { useState, useContext, useEffect} from 'react';
import { useAuth0 } from '@auth0/auth0-react';
import { ValueContext } from './ValueContext'
const LoginButton = () => {
  const { loginWithRedirect, isAuthenticated } = useAuth0();

  const [login, setLogin] = useContext(ValueContext); 

    const updateLogin = () => {
    
    setLogin({loggedIn:'true'});
    console.log(login.loggedIn + " = login.loggedinvalue after update")
    console.log('true log')
    loginWithRedirect()
  };  

  return (
    !isAuthenticated && (
      <>
      <button onClick={() => updateLogin() }>
        Log In
      </button>
      <h1>{login.loggedIn}</h1>
        </>
    )
  )
}

----------

这是因为我没有提交页面吗？如果您需要提交，这似乎会使钩子非常有限，所以我猜也不是这样

Answer 1

我只是在这里猜测。

我假设当您调用 loginWithRedirect 时，应用程序会离开您的应用程序（到 Auth0? 站点），然后用户进行身份验证，然后浏览器会重定向回您的应用程序。如果发生这种情况，您在 ValueContext 上下文中保存的任何内容都将重置为其初始状态。在ValueContext 的初始化过程中，您需要考虑当前用户身份验证。

此外，useAuth0 钩子提供的isAuthenticated 标志似乎与您的ValueContext.login 标志具有几乎相同的含义。你真的需要login 标志吗？如果需要，您必须始终保持ValueContext.login 的值与isAuthenticated 同步以避免任何奇怪的行为。