问题标签 [react-apollo]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
3218 浏览

graphql - After a mutation, how do I update the affected data across views?

enter image description here

I have both the getMovies query and addMovie mutation working. When addMovie happens though, I'm wondering how to best update the list of movies in "Edit Movies" and "My Profile" to reflect the changes. I just need a general/high-level overview, or even just the name of a concept if it's simple, on how to make this happen.

My initial thought was just to hold all of the movies in my Redux store. When the mutation finishes, it should return the newly added movie, which I can concatenate to the movies of my store.

After "Add Movie", it would pop back to the "Edit Movies" screen where you should be able to see the newly added movie, then if you go back to "My Profile", it'd be there too.

Is there a better way to do this than holding it all in my own Redux store? Is there any Apollo magic I don't know about that could possibly handle this update for me?


EDIT: I discovered the idea of updateQueries: http://dev.apollodata.com/react/cache-updates.html#updateQueries I think this is what I want (please let me know if this is not the right approach). This seems better than the traditional way of using my own Redux store.

#xA;

After addMovie mutation, this properly updates the view in "My Profile" because it uses the getMovies query (woah)! I'm then passing these movies as props into "Edit Movies", so how do I update it there as well? Should I just have them both use the getMovies query? Is there a way to pull the new result of getMovies out of the store, so I can reuse it on "Edit Movies" without doing the query again?


EDIT2: Wrapping MyProfile and EditMovies both with getMovies query container seems to work fine. After addMovie, it's updated in both places due to updateQueries on getMovies. It's fast too. I think it's being cached?

It all works, so I guess this just becomes a question of: Was this the best approach?

0 投票
1 回答
1057 浏览

graphql - 阿波罗更新查询未调用?

我正在研究 GitHunt-React 和 GitHunt-API 中的 Apollo pub-sub。当我运行这些应用程序并输入新评论时,评论由提交调用保存,然后 updateQueries 代码块在此处运行:

我已将此代码复制到我的应用程序中。突变已正确保存,但 updateQueries 代码块运行:

为什么我的 updateQueries 调用不运行?提前感谢所有人提供的任何信息。

更新:每个请求,这里是 CREATE_IM_MUTATION 的代码:

更新:根据 Slack 上@fabio_oliveira 的请求,这是我正在更新的查询:

0 投票
1 回答
497 浏览

javascript - 将 redux 客户端从 REST 转换为 GraphQL Apollo?

我有这个休息应用程序可以获取这样的数据,带有用于 redux 的 thunk + promise 中间件:

来自这里的数据进入存储,组件使用从那里获取的数据。

我可以用 graphql 查询或其他东西交换“有效负载”中的其余请求吗?

让我困惑的是,Redux 说:“数据存在于存储中,只能通过操作来更改”,但 Apollo 将数据直接绑定到组件。我已经制作了一个 GraphQL API,在 graphiql devtool 中效果很好,但是在阅读了这篇文章之后,我对它在客户端中的处理方式有点困惑。

0 投票
1 回答
576 浏览

javascript - Apollo 服务器 + React Apollo pubSub 不显示数据

突变后,我似乎无法在我的反应前端收到 pubSub 数据

我有以下 Graphql 架构:

在我的 apolloServer 上,我像这样发送 pubSub 数据

该 console.log 将输出:

最后在我的反应前端我有以下内容:

}

在上面的console.log 订阅数据始终为空。

我是否将响应包装错了或类似的东西?

0 投票
2 回答
3848 浏览

react-apollo - 你如何动态控制 react apollo-client 查询启动?

使用apollo-client查询包装的 react 组件将自动发起对服务器的数据调用。

我想仅在特定用户输入上触发数据请求。

您可以在查询选项中传递跳过选项- 但这意味着 refetch() 函数不作为组件提供;并且似乎没有在道具更新时动态评估 skip 的值。

我的用例是地图组件。我只希望在用户按下按钮时加载标记的数据,而不是在初始组件安装或位置更改时加载。

下面的代码示例:

0 投票
1 回答
4045 浏览

graphql - 配置 Apollo GraphQL 挂起请求

我想在我的 graphQL 请求上设置一个任意计时器。比如说,我提出一个请求,Apollo 需要超过 10 秒才能发回一个错误。

想法?

我是否需要使用 Apollo 客户端和 Apollo 服务器来执行此操作(比如数据库等其他服务请求)?

0 投票
2 回答
1676 浏览

graphql - Graphql 可选操作变量

我正在尝试使用可选的过滤器参数编写一个简单的查询

例如

我不断得到

它让我觉得它在服务器端,但我的架构非常简单

查看 graphql 规范以指定某些内容是否是可选的,您是否使用!. 如您所见,电子邮件不是必需的。

注意我正在使用 apollo 客户端/服务器和 react-apollo。我的版本

我错过了什么吗?我以为我修好了它,但它停止了工作,所以我猜不是。

0 投票
1 回答
1512 浏览

apollo - 如何在其包装组件之外重新获取查询?

我有两个屏幕:

屏幕 1:结果

屏幕 2:编辑过滤器

当我在 Screen2 上编辑过滤器并按回时,我想重新获取 Screen1 上的查询(使用新构建的过滤器字符串变量)。编辑过滤器不使用突变或触发任何 Redux 操作(我将用户搜索过滤器/首选项存储在 localStorage/AsyncStorage 而不是数据库中,因此没有突变)。我只是在更改表单的本地状态并使用它来构建一个过滤器字符串,我想将它传递给 Screen1 上的某个查询。如果有帮助,我可以访问两个屏幕上的过滤器字符串。

似乎refetch()仅限于其查询包装的组件http://dev.apollodata.com/react/receiving-updates.html#Refetch那么我将如何从不同的屏幕重新运行查询?

我尝试在 Screen1 和 Screen2 上放置相同的查询,然后在 Screen2 上调用 refetch,虽然查询有效并在 Screen2 上获取新数据,但同名查询不会在我实际需要的 Screen1 上更新。如果他们有相同的名字,难道不应该吗?(但过滤器变量已更改)

在此处输入图像描述

如果我只是设计不正确并且有更简单的方法可以做到这一点,请告诉我。我希望如果我有 2 个屏幕,将相同的查询放在两个屏幕上,并使用新的过滤器变量重新获取其中一个查询,那么重新获取应该在两个地方发生,但它目前正在单独处理它们。

0 投票
6 回答
26299 浏览

javascript - 我如何处理 react-apollo 中的删除

我有一个突变

在另一个位置,我有一个元素列表。

有没有更好的东西可以从服务器返回,我应该如何更新列表?

更一般地说,在 apollo/graphql 中处理删除的最佳实践是什么?

0 投票
1 回答
2828 浏览

reactjs - 使用 React-Apollo 设置 React-Storybook

有什么方法可以将 React-Apollo 与 React-Storybooks 一起使用?以前我尝试过 Relay,有一个模块 ( https://github.com/orta/react-storybooks-relay-container ) 允许创建不需要网络访问但使用静态数据的存根容器。

React-Apollo 框架是否有等价物?http://dev.apollodata.com/react/

FWIW 我正在使用 React-Native,但一切背后的想法和设置应该非常相似(例如,我使用https://github.com/storybooks/react-native-storybook而不是基于 Web 的解决方案)