时间戳

首页 > 解决方案 > 使用 Typescript 反应钩子：期望一个赋值或函数调用，而是看到一个表达式

javascript - 使用 Typescript 反应钩子：期望一个赋值或函数调用，而是看到一个表达式

问题描述

我成为 React 开发人员已有一段时间了。在工作中，我们现在介绍了我相对较新的 Typescript。

我创建了一个使用 cookie 的钩子，但我返回的函数导致错误。

钩子（删除了一些公司的东西）：

function useCookies(key: string) {
  const [storedCookie, setStoredCookie] = useState(() => getCookieValue(key));

  function setCookie(value: any, daysUntilExpiry?: number): any {
    if (value) {
      const valueToStore =
        value instanceof Function ? value(storedCookie) : value;
      setStoredCookie(valueToStore);

      let cookieString = `${key}=${valueToStore}`;
      if (daysUntilExpiry) {
        const date = new Date();
        date.setDate(date.getDate() + daysUntilExpiry);
        cookieString = `${cookieString}; expires=${date}`;
      }
      document.cookie = cookieString;
    }
  }

  return [storedCookie, setCookie];
}

const [loggedIn, setAuthState] = useCookies('logged_in');

setAuthState(true, 7);

setAuthState 函数调用给了我错误Expected an assignment or function call and instead saw an expression。谁能指出我为什么？！

标签： javascriptreactjstypescript

解决方案

useCookies 的返回类型被推断为一个任意长度的数组，并且可以包含设置 cookie 的字符串或函数。因此，当您从列表中取出第二项时，TS 认为这可能是字符串或函数。

要解决此问题，如果您使用的是 3.4+，当您从函数返回值时，只需在as const返回时将其标记为：

return [cookie, setCookie] as const;

编辑：上面 Per Svensson 的建议也修复了它。

推荐阅读