使用与 useMutation 失败相同的方式使用 useQuery 挂钩
Use `useQuery` hook the same way as `useMutation` fails
使用 React 和 Apollo React 钩子
import { useCallback, useState } from "react";
import { useMutation, useSubscription, useQuery } from "@apollo/react-hooks";
我得到了一个函数 useChannel
,其中包含我所有的 graphql 突变。
每个突变都被导入,然后声明为常量,如下所示:
const [addExportChannel] = useMutation(AddExportChannelMutation);
我像这样在钩子的返回函数中使用的
const onAddImportChannel = useCallback(
async (props) => {
try {
const data = await addImportChannel({
variables: {
shopId,
name: props.name,
url: props.url,
filetype: props.filetype
}
});
...
当我尝试对 useQuery
做同样的事情时,它失败了,说 useQuery
不可迭代。
TypeError: useQuery is not a function or its return value is not iterable
const [FeedProcess] = useQuery(GetFeedProcessQuery);
...
const onFeedProcess = useCallback(
async (props) => {
try {
const data = await FeedProcess({
variables: { shopId, feedId: props.feedId }
});
...
我在这里遗漏了什么,试图弄清楚这两个钩子有什么不同。
你应该像这样从 useQuery 钩子中解构道具:
const {data, loading, error} = useQuery(GetFeedProcessQuery);
因为 useQuery 被立即调用,所以不能像这样存储它 (const [FeedProcess] = useQuery(GetFeedProcessQuery);
)。但是 apollo 有 useLazyQuery 可以像你一样存储。如果您想稍后存储和调用它,请改用 useLazyQuery。
使用 React 和 Apollo React 钩子
import { useCallback, useState } from "react";
import { useMutation, useSubscription, useQuery } from "@apollo/react-hooks";
我得到了一个函数 useChannel
,其中包含我所有的 graphql 突变。
每个突变都被导入,然后声明为常量,如下所示:
const [addExportChannel] = useMutation(AddExportChannelMutation);
我像这样在钩子的返回函数中使用的
const onAddImportChannel = useCallback(
async (props) => {
try {
const data = await addImportChannel({
variables: {
shopId,
name: props.name,
url: props.url,
filetype: props.filetype
}
});
...
当我尝试对 useQuery
做同样的事情时,它失败了,说 useQuery
不可迭代。
TypeError: useQuery is not a function or its return value is not iterable
const [FeedProcess] = useQuery(GetFeedProcessQuery);
...
const onFeedProcess = useCallback(
async (props) => {
try {
const data = await FeedProcess({
variables: { shopId, feedId: props.feedId }
});
...
我在这里遗漏了什么,试图弄清楚这两个钩子有什么不同。
你应该像这样从 useQuery 钩子中解构道具:
const {data, loading, error} = useQuery(GetFeedProcessQuery);
因为 useQuery 被立即调用,所以不能像这样存储它 (const [FeedProcess] = useQuery(GetFeedProcessQuery);
)。但是 apollo 有 useLazyQuery 可以像你一样存储。如果您想稍后存储和调用它,请改用 useLazyQuery。