javascript - 将“refetch”传递给上下文

我正在尝试将useQuery()中的refetch传递到上下文中，以便可以从上下文中调用该refetch。我无法找出正确的类型，所以我遇到了类型不匹配的问题，或者IDE没有抱怨，但是应用程序因类型不匹配而中断。当浏览器崩溃时，它报告refetch()不是函数。

我只想将refetch传递给Context并能够调用它。任何帮助表示赞赏。

IDE typings error

以下是相关代码：

Context道具的界面：

interface ConfirmationModalContextInterface {
   ...
   setRefetch: (refetch: (variables?: Record<string, any>) => Promise<ApolloQueryResult<any>>) => void;
}

上下文确认模式的界面：

interface ConfirmationModalProps {
   ...
   refetch: (variables?: Record<string, any>) => Promise<ApolloQueryResult<any>> | undefined;
}

原始的refetch实例：

const {loading, error, data, refetch} = useQuery(queries.USER_POSTS);

上下文的道具设置：

const confirmModalContext = useContext(ConfirmationModalContext);
const {..., setRefetch} = confirmModalContext;

setRefetch(refetch);

最佳答案

如错误所示，refetch可能未定义，但您的界面未考虑在内。也就是说，不必像这样传递refetch函数-只需在需要的任何组件内重用相同的useQuery钩子即可。您可以在多个组件中使用相同的useQuery挂钩，而无需触发多个请求。