Question

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

我想做一些基本的事情：

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

问题在于，因为我是在组件外部执行此操作，因此无法使用useCookies，因此我的组件永远都无法获得已被删除的更新。

有想法吗？

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

干杯！

Answer 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()
  }  
}

如何在阿波罗本地状态中触发React Hook

1 个答案: