如何从 React useEffect 中的另一个函数访问状态

Question

const ClientContextProvider = React.memo((props) => {
    const [httpState, dispatchHttp] = useReducer(HttpReducer, initialHttpState())
    const [username, setUsername] = useState(null)
    const [givenName, setGivenName] = useState(null)
    const [surname, setSurname] = useState(null)

    useEffect(() => {
        loadClient();
    }, [])

    const loadClient = () => {
        console.log('Loading client info...')
         const errorMsg = "Error, unable to get logged in client information!";
         const callbacks = {
             [Constants.SUCCESS]:   {   status: OK,
                                    callback: (responseData) => {
                                        setUsername(responseData.username)
                                        setGivenName(responseData.givenName)
                                        setSurname(responseData.surname)
                                        loadAllJobs(username);
                                }}
        };
        axiosGetRequest(process.env.REACT_MYSERVICE_API_USER_LOGIN, errorMsg, dispatchHttp, callbacks);
     }

    const loadAllJobs = (username: string) => {
        if (username === null) {
            console.log('loadAllJobs: username is undefined')
        } else {
        const errorMsg = "Error, unable to get job information for logged in client!";
    
// Function carries on, calls api again using username as part of url

}

我试图在我的 loadAllJobs() 函数中访问用户名状态。 我最初在 useEffect 中有 loadClient() 和 loadAllJobs() 。 用户名在 loadAllJobs 函数中始终为空，因此我尝试在其上设置一个计时器，使其在 7 秒后运行，认为状态将有时间更新。 这也不起作用。 现在我已经尝试在我的初始函数的回调中加入 loadAllJobs 函数，这样它就会在 setStates 发生时发生。 这也不起作用，从我的 loadAllJobs 函数访问时，用户名仍然为空。 任何帮助表示赞赏！

Answer 1

  const callbacks = {
    [Constants.SUCCESS]: {
      status: OK,
      callback: responseData => {
        setUsername(responseData.username);
        setGivenName(responseData.givenName);
        setSurname(responseData.surname);
        loadAllJobs(username);
      },
    },
  };

这不会仅仅因为状态更新不同步而起作用。 在组件生命周期的这个状态下，用户名仍然为空。 它的值将在下一次渲染时更新，但为时已晚。

但是你为什么要把它弄得这么复杂？ 只需像这样调用loadAllJobs就可以了： loadAllJobs(responseData.username) 。