Typescript 更新自定义挂钩内的状态不会反映在订阅组件中

我已经创建了一个钩子useToken，它跟踪和更新我的访问和刷新令牌的状态.

当应用程序启动时，令牌将从本地存储中提取并刷新，以更新挂钩状态的值以及本地存储中的值.

本地存储中的值按预期更新，但状态的值不反映更改.我知道setState是异步的，但即使在等待或使用时也是如此.则()状态不会更新.

在使用令牌的下方可以注意到这一点，并且请求失败，因为访问令牌不匹配.

/hooks/useTokens.tsx:个

import { useState } from "react";

export default function useTokens() {
  const [tokens, setTokensState] = useState({
    apiToken: localStorage.getItem("apiToken"),
    refreshToken: localStorage.getItem("refreshToken"),
  });

  const setTokens = (tokenParams: {
    apiToken: string | null;
    refreshToken: string | null;
  }) => {
    const newTokens = { ...tokens, ...tokenParams };
    setTokensState(newTokens);
    newTokens.apiToken
      ? localStorage.setItem("apiToken", newTokens.apiToken)
      : localStorage.removeItem("apiToken");
    newTokens.refreshToken
      ? localStorage.setItem("refreshToken", newTokens.refreshToken)
      : localStorage.removeItem("refreshToken");
  };

  return { tokens, setTokens };
};

home.tsx个个

const { tokens, setTokens } = useTokens();
...
      refreshToken(tokens.refreshToken!).then(
        ({ isSuccessful, data, status }) => {
          if (isSuccessful) {
            // data.access_token contains new token
            // tokens.xyz contains old access/refresh token even after setTokens
            setTokens({
              apiToken: data.access_token,
              refreshToken: data.refresh_token,
            });
            accountsAndAuthCheck();
          } else {
            console.log("refresh", data, status);
            setTokens({ apiToken: null, refreshToken: null });
            navigate("/link", { replace: true });
          }
        }
      );

home.tsx个个

...
const accountsAndAuthCheck = () => {

    // tokens.apiToken has not updated
    getAccounts(tokens.apiToken!).then(({ isSuccessful, data, status }) => {
      if (isSuccessful) {
        setIsAuthorised(1);
        const _accountId = data.accounts[0].id;
        setAccountId(_accountId);
      } else {
        if (status == 403) {
          setIsAuthorised(-1);
        }
      }
    });
  };
...