使用useState存储useQuery中的数据

Question

我使用React钩子通过react-apollo获取GraphQL数据并存储本地状态：

const [userData, setUserData] = useState({})
const { loading, error, data } = useQuery(USER_QUERY)

但是，我想知道如何将data存储到userData中。它的工作原理是这样的：

useEffect(() => {
  setUserData(data)
}, [Object.entries(data).length])

Answer 1

看起来你所拥有的可能是有效的。在options参数中还提供了一个onCompleted选项。它接受以下类型的回调：

(data: TData | {}) => void

所以这是另一种方式：

const { loading, error, data } = useQuery(USER_QUERY, {onCompleted: setUserData})

Answer 2

您试图如何处理返回的数据，而这些数据不能通过简单地将其从查询钩子中去结构化地使用来完成？在大多数用例中，它可以立即使用，因为它会在重新获取时自我更新。

如果有必要(也可能是这样)，就像另一个答案所说的那样，您发布的useEffect钩子应该可以工作，但我会简单地用data替换依赖项，以防止出现响应具有相同长度且由不同数据组成且不更新的边缘情况：

useEffect(() => {
  setUserData(data)
}, [data])