问题标签 [vue-apollo]

我对这些技术完全陌生，并且难以理解它，所以请耐心等待。所以，我的情况是我已经在 Heroku 上部署了 Hasura 并添加了一些数据，现在我正在尝试实现一些功能，我可以在其中添加和编辑表格的某些行。具体来说，我从 Hasura 和vue-apollo一直在关注这个。

我已经实现了添加和编辑（有效），现在还想通过使用update突变的属性并更新缓存来在表中反映这一点。不幸的是，这就是我迷路的地方。我将在下面粘贴一些代码以使我的问题更清楚：

添加播放器 ( ADD_PLAYER_MUTATION) 的突变（与上面链接的 Hasura 文档中的突变相同）：

.vue文件中的突变代码

我真的没有得到update突变的一部分。在大多数示例中，该 { data: { x } }位使用函数的名称代替x，因此我也这样做了，即使我真的不明白为什么（至少对我来说很困惑）。记录data玩家数组时会记录，但记录时addPlayer undefined会记录。

我可能做错了对其他人来说非常简单的事情，但我显然不确定是什么。也许突变没有返回正确的东西（尽管我假设它不会undefined在那种情况下登录），或者根本没有返回任何东西。这尤其令人困惑，因为播放器实际上已添加到数据库中，所以它只是update不起作用的部分 - 另外，大多数指南/教程都显示相同的内容而没有太多解释。

在一个 Vuepress 博客站点中，我在我的 markdown 博客文章中插入了一个组件，该组件从数据库获取信息以填充其数据。

我有一个 GraphQL 服务器来提供数据，所以我尝试使用vue-apollo在我的组件中获取它。

我尝试在enhanceApp.js文件中添加 vue-apollo，如下所示：

在我的组件文件中：

但是$apolloDataVue 组件中的 my 是空的，永远不会执行查询。

我认为它与Browser API Access Restrictions有关系，所以我尝试将查询放在mounted()钩子中：

这给我一个错误：

vue.runtime.esm.js?2b0e:619 [Vue 警告]：挂载钩子中的错误：“TypeError：无法读取未定义的属性‘defaultClient’”

这让我觉得里面的设置enhanceApp.js可能无法正常工作。

我看了一点ApolloSSR，但它似乎不适合我，因为我的 GraphQL 请求通常不依赖于路由。

我发现的一种解决方法是使用直接导入到我的组件文件中的 axios 或 ApolloClient：

我想这可以工作，但我想知道 vue-apollo 在我的情况下是否真的不可用。

有什么提示吗？

谢谢！！

我正在 Nuxt 中使用 Apollo 获取一些数据。不知何故，当导航到该页面时，我收到一个错误

当我刷新页面时，一切都按预期工作。

我发现一些人有类似的问题，但似乎没有解决方案对我有用：/

这是我现在的模板文件：

/products/_slug.vue

除非我刷新页面，否则 $apolloData 基本上是空的。任何想法将不胜感激

编辑 又近了一步（我认为）。以前，第一次导航到页面时，所有内容（image.url 和名称）都是未定义的。

我补充说：

在我的导出顶部，现在至少总是定义名称，所以如果我删除图像，一切都会按预期工作。只是 image.url 一直未定义。

我注意到的一件事（不确定有多相关）是这个问题只发生在使用 , 如果我使用普通的 a 标签它可以工作，但当然会带走 vue 的魔力。

EDIT-2 因此，如果我将 Nuxt 降级到 1.0.0 版本，一切正常

我是 VueJS 和 NodeJS 开发的新开发人员。

我在前端部分使用 apollo-boost、graphql、vue-apollo，在后端部分使用 express-graphql、express、graphql、knex、MySQL。

运行后端部分后，我得到如下正确响应：输入参数

输出：

所以我认为代码在服务器端是可以的。现在我想在 vuejs 中显示这些数据。我实现的代码如下：

我没有收到任何错误，但没有任何结果显示在前端部分。请让我知道做错了什么？

我正在使用nuxtwithapollo-module并且我需要拦截可能的网络错误（更具体地说是 401/403），以便我可以显示一些错误模式并注销我的用户。在文档中，我看到在里面nuxt.config.js你可以这样做：

但是在该配置文件中，我无法访问我需要的应用程序功能（例如错误模式或我的路由器）。有什么办法存档吗？

单击“流行”时，如何用新查询（getPopular）的结果替换内容？

（ v-for="casino in allCasinos" 需要改为显示： v-for="casino in getPopular" ）

我在使用vue-apollo从这个端点接收电影数据时遇到了很多问题。

端点： http: //movie-database-graphql.herokuapp.com/graphiql

这就是我配置它的方式（Vuetify 用于造型顺便说一句）：

main.js

我相信问题出在我如何通过 Apollo 调用数据库但还不确定。我尝试了很多方法，遵循文档并且总是失败。

MovieList.vue（带有查询的组件）

你明白我错过了什么吗？我没有收到任何电影数据（没有显示错误...）。电影数组总是空的

我想更新或重新获取方法（不是 apollo 对象）中使用的 apollo 查询中的数据。问题是我想在特定事件之后查询和更新该查询，所以我不能在我的代码中直接使用 apollo 对象。

总之，当pagination.statusFilter或eventsSearchInputVal或items.view.organizerId在watch发生变化时，查询应该重新获取。在这段代码中，当这些变量发生变化时，什么都不会发生。

我正在寻找使用 Vue Apollo / Nuxt 驱动的前端来查询由 django-graphene 驱动的 GraphQL 后端，以检索单个产品的数据。

我尝试发送查询的方法导致以下错误：

我目前的代码如下：

_slug.vue

graphql/products.js

以下查询适用于我的后端：

我知道这可能是一个简单的语法错误，但我不完全确定如何修复它。

编辑：正确的查询如下 - 感谢@DanielRearden：

我正在使用 XAMPP 并desk从本地网络中的另一台 PC 打开一个托管在 PC 上的网站。

我正在使用带有CreateFreshApiToken中间件的 Laravel Passport。当我从 PC“ desk” 发布到我的 GraphQL API 时，一切正常，但从另一台 PC 发布失败：没有发送 cookie。

Cookie 仅适用于 HTTP。我想知道这是否是一些跨域问题，但我在任何地方都使用相同的域：http://desk以及http://desk/graphql我的 API。

为什么不发送 cookie？

阿波罗客户端设置

编辑 1

我发现在其他机器上它可以在 Chrome 上运行（仅限桌面，而不是移动设备），但不能在 Edge 上运行。

编辑 2

如果我只是这样做

然后附加cookie标头。为什么它不适用于 Apollo 客户端？