如何在 Apollo Local State 中触发 React Hook答案

【问题标题】：How to trigger React Hook in Apollo Local State如何在 Apollo Local State 中触发 React Hook
【发布时间】：2020-02-05 02:59:24
【问题描述】：

所以...我在我的 React 应用程序中使用 Apollo 进行本地状态管理。我也在使用react-cookie（它在内部依赖于反应钩子）。

我想做一些非常基本的事情：

const logout = async (_, args, {cache}) => {
  const cookies = new Cookies()
  cookies.removeCookie (`auth`)
  cache.writeData ({data: {isAuthenticated: false}})
}

问题是因为我在组件之外执行此操作，所以我不能使用 useCookies，因此我的组件永远不会得到它已被删除的更新。

想法？

我真的不想在将我的状态逻辑放入解析器和使用 React 钩子之间做出选择。我猜同样的事情也适用于 redux。

干杯！

【问题讨论】：

标签： react-hooks apollo apollo-client react-cookie

【解决方案1】：

在 cookie 和组件状态 (which is what this library does) 中复制相同状态的唯一好处是反应性 - 如果 cookie 发生更改，这样做将允许您的组件自动更新。如果您不需要该功能，最好只使用一些不使用 React 特定功能的库，例如 js-cookie。即使您需要监听 cookie 的变化，您也可以使用 universal-cookie 之类的库（react-cookie 在后台使用的库）来完成此操作。

如果您一心想要使用react-cookie，那么您的logout 突变将只需要更新本地状态，并且您需要将组合逻辑提取到单独的挂钩中。比如：

function useLogout = () => {
  const [updateLocalState] = useMutation(LOGOUT_MUTATION)
  const [removeCookie] = useCookies(['auth'])
  return async () => {
    await updateLocalState()
    removeCookie()
  }  
}

【讨论】：