时间戳

首页 > 解决方案 > AWS AppSync + React-Apollo Query/useQuery 引发异常 this.currentObservable.query.getCurrentResult 不是函数

reactjs - AWS AppSync + React-Apollo Query/useQuery 引发异常 this.currentObservable.query.getCurrentResult 不是函数

问题描述

我是 GraphQL/Apollo 的新手，我很难用 React 应用程序设置它。

我有一个 React 组件，它从使用 Amplify/AppSync 构建的 GraphQL API 加载列表。

如果我手动调用以获取项目，即：

    const videosData = await client.query({
      query: gql(queries.listVideos)
    });
    const videosItems = videosData.data.listVideos.items;
    setVideosData(videosItems);

奇迹般有效。但是，如果我尝试使用 Apollo Query 组件或 useQuery 挂钩，则会引发以下错误：

TypeError：this.currentObservable.query.getCurrentResult 不是函数

如果我只是添加行以使用钩子获取查询，它已经给了我这个错误

钩子调用：

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

引发问题的被调用函数：

QueryData.getQueryResult
node_modules/@apollo/react-hooks/lib/react-hooks.esm.js:325
  322 |     called: true
  323 |   });
  324 | } else {
> 325 |   var currentResult = this.currentObservable.query.getCurrentResult();
      | ^  326 |   var loading = currentResult.loading,
  327 |       partial = currentResult.partial,
  328 |       networkStatus = currentResult.networkStatus,

<Query>如果我使用该组件，则会发生完全相同的问题

软件包版本：

"aws-amplify": "^1.1.30",
"aws-amplify-react": "^2.3.10",
"aws-appsync": "^1.8.1",
"graphql-tag": "^2.10.1",
"react-apollo": "^3.0.1",

知道我可能做错了什么以及如何解决吗？

标签： reactjsgraphqlreact-apolloaws-amplifyaws-appsync

解决方案

如果添加：

"resolutions": {
  "apollo-client": "2.6.3"
}

在您的package.json并重新安装它应该可以工作。

您可能会看到以下警告：

Resolution field "apollo-client@2.6.3" is incompatible with requested version "apollo-client@2.4.6"

这是因为 Appsync 依赖于旧版本的 react-apollo，但我发现它运行良好。

您可以关注这个问题，希望很快就会得到解决，我们不再需要这样做了。

推荐阅读