如何有条件地调用 useQuery 钩子？

Question

由于 Rules of Hooks，不应有条件地调用挂钩。那么如何使用 useQuery 有条件地获取数据呢？例如，假设我想在功能组件中获取数据，但前提是 someState === someValue?即我想避免在任何条件之前调用 useQuery() 因为在这些时候获取数据没有意义。

Answer 1

在 apollo 的 documentation 中，显示有一个可以添加的跳过选项： useQuery（查询，{skip:someState===someValue}）

否则，如果您想运行查询运行而不是立即查询，您也可以 useLazyQuery。

Answer 2

您还可以为条件查询使用启用的属性 of useQuery 选项。

 // Get the user
 const { data: user } = useQuery(['user', email], getUserByEmail)

 const userId = user?.id

 // Then get the user's projects
 const { isIdle, data: projects } = useQuery(
 ['projects', userId],
 getProjectsByUser,
  {
    // The query will not execute until the userId exists
    enabled: !!userId,
  }
 )

如何有条件地调用 useQuery 钩子？

How to call useQuery hook conditionally?

reactjs

react-apollo

react-apollo-hooks