问题标签 [relay]

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 投票
1 回答
171 浏览

reactjs - 一种处理 React 应用程序中的依赖关系解析和乐观更新的方法

在对象具有许多复杂关系的架构中,有哪些可维护的方法来处理

  1. 解决依赖关系
  2. 乐观的更新

在反应应用程序中?

例如,给定这种类型的模式:

用户可能想要保存以下内容 ->

第一个问题:选择真实身份

上面的第一个问题是正确的id. 即为了让 secondFoo 保存,它需要知道 firstFoo 的实际 id。

为了解决这个问题,我们可以做出权衡,让客户端选择 id,使用类似 uuid 的东西。我看不出这有什么严重的错误,所以我们可以说这可行

第二个问题:按顺序保存

即使我们从前端确定了 id,服务器仍然需要按顺序接收这些保存请求。

这里的理由是后端必须保证被引用的任何 id 都是有效的。

我不确定解决这个问题的最佳方法是什么

目前想到的方法

  1. 有自定义操作,通过承诺进行协调

    save(biz).then(_ => save(Bar).then(_ => save(firstFoo)).then(_ => save(second)

这里的缺点是它相当复杂,并且这些组合的数量将继续增长

  1. 创建一个挂起/解析助手

    ```

2. 的问题是,如果我们忘记解决或添加到挂起,它很容易导致一堆错误。

潜在的解决方案

似乎 Relay 或 Om next 可以解决这些问题,但我想要一些功率较低的东西。也许可以与 redux 一起使用的东西,或者是我缺少的一些概念。

非常感谢的想法

0 投票
0 回答
191 浏览

graphql - GraphQLRange 找不到具有光标的段

保存评论突变后我收到以下错误

GraphQLRange 找不到具有光标的段:MTQ2NzkxNTE5NA==

这只发生在我在添加新评论之前要求更多评论之后

这是我的 createContainer 代码:

这是我的保存评论突变

这是生成的 graphql 查询,如果我尝试使用 graphql,它就可以工作

我认为发生这种情况是因为它找不到应该附加新创建的评论的正确评论列表

0 投票
1 回答
111 浏览

graphql - 如何在中继中进行身份验证

验证用户的正确点是什么?

以继电器入门套件为例。

这似乎是要查询的点(我已经添加了 args id)

然后在数据库中做类似的事情

现在它已经分崩离析了,请求ID的地方在哪里?我会假设路线

这行不通。

0 投票
1 回答
926 浏览

javascript - 中继/ graphql:可为空的响应或捕获查询错误的方法

在 relay/graphql 中,如何表达一个响应可以为空的查询。我现在有一个难题,我不能用空/空响应来响应,因为id中继需要字段(可能还有 graphql 模式中的其他不可为空的字段),并且我不能发送错误,因为它会阻止我的组件被渲染.

例如,假设我正在建模一个关系层次结构并且有一个类似的查询

getSpouse(partnerID: string): Person

这对某些人来说可能是空的。因此,我要么使用 null Person 对象进行响应(我认为中继不太可能,因为 Person 可能具有包括 globalID 在内的不可为空的字段),或者发送错误。可以发送错误,但我不确定如何捕获此错误并继续渲染中继容器。我知道在发生突变的情况下很容易出错,但是查询是由中继容器处理的,并且看不到一个接口来获取错误并继续加载组件。

有没有办法在中继容器中捕获查询错误或将其传递给我的组件?

0 投票
1 回答
797 浏览

react-router - 带有 React Router Relay 的 GraphQL:预期类型 Int,找到数字路由的 String

我使用react-router-relay包有以下路由器和路由

我来自 GraphQL 的 StoreType 如下所示,用户字段接受一个表示非空整数的 id 参数:

user/:userId我的路线中继容器:

当我在浏览器中访问 /user/1 时,react-router-relay 将路由:userId视为字符串而不是整数,GraphQL 返回 JSON 编码的错误消息"Argument \"id\" has invalid value \"1\".\nExpected type \"Int\", found \"1\"."

有没有办法将 URL 中传递的 userId 参数转换为整数?或者是否有支持格式良好的数字字符串和整数的自定义 GraphQL 标量类型?对此的任何意见或方向表示赞赏。

0 投票
1 回答
941 浏览

graphql - Relay/GraphQL 将自定义字段添加到连接

我正在尝试添加要用于分页的记录总数。现在我可以看到我无法修改它以使我的 totalCount 与它分开的连接。

在这种情况下,当我在 BookConnection 中获取连接对象时。我希望能够将该值分配给一个字段。

如何创建变量totalCount的属性?connection

我在这里找到了部分答案:How to pass total count to the client in pageInfo

0 投票
1 回答
548 浏览

graphql - 如何在中继片段中连接变量

当我们使用时类似${Component.getFragment('fragment')},有没有一种方法可以简单地将变量与中继片段内的有效查询连接起来?与此类似:

谢谢!

0 投票
1 回答
798 浏览

connection - GraphQL Connections for Relay 中的光标有哪些限制?

我几乎完成了 NodeJS 的包https://github.com/nodkz/graphql-compose-connection,它允许为使用 graphql-compose 构建的 graphql 类型构建连接类型。

该软件包完全遵循中继光标连接规范 ( https://facebook.github.io/relay/graphql/connections.htm ),并添加了很多功能:filterarg(用于过滤记录)和sortarg(用于按唯一索引对记录进行排序)。

所以我有以下关于光标唯一性的问题:

1)游标在不同类型中应该是唯一的吗?

2) cursor 在具有不同参数的一个连接中是否应该是唯一的?

例如。在 UserConnection 我有过滤器 arg。我想在第一个列表中显示所有用户,在第二个列表中显示在线用户(页面上同时显示 2 个列表)。两个列表中可能存在一个具有相同光标的用户。

3)如果Relay在一个连接中得到相似的游标,会报错吗?

4) 游标应该是 base64 编码,还是可能包含字符串化的 json 对象?

0 投票
2 回答
240 浏览

graphql - 通过 setVariables 中继请求

当通过 setVariables 发出请求时,有没有办法考虑异步请求之间的本地状态,即实现加载指示器?

向https://www.graphqlHub.com/graphql提出请求的插图

这不会跟踪加载状态,并且加载将立即传递给 false,而对视图的异步更改将有延迟。

如果我们将加载移动到 setVariables 有没有办法跟踪响应?在根容器中,可以通过以下方式跟踪响应

有没有类似的方法Relay.createContainer

使用 setVariables 浏览数据集是不好的做法吗?

完整代码

0 投票
1 回答
1572 浏览

reactjs - 如何同步 Redux 和 Relay?

情况

我有一个入职场景,用户逐步入职。我想用 Redux 管理用户进度的客户端状态。在 Relay 中已经实现了服务端和客户端之间的同步,但是我仍然需要一个 Redux 存储来进行客户端状态管理。因此,同步 Relay-/Redux-Store 会出现问题。

我现在正在做的是用 Redux 和 Relay 包装我的 React 组件:

我的进步

我找到了完成不同操作的方法,如下所示:

使用服务器数据初始化 Redux 存储

我在使用异步原始 Relay 查询创建存储后立即初始化 Redux 状态。为了实现这一点,我也在使用redux-thunk中间件。Redux 向 Relay 发起请求,该请求查询服务器。可视化表示(箭头表示数据流,元素的顺序反映了“调用顺序”):Redux <= Relay <= Server

调度 Redux 操作时更新服务器上的数据

Redux => Relay => Server

为了获得一致的状态更改,当用户完成入职流程时,我会触发一个 Redux 操作,该操作也将异步执行 Relay 突变。我也redux-thunk用于此目的。

未解决的问题

我仍然没有找到解决以下情况的方法:

在 Relay Store 更新时更新 Redux Store

服务器上数据的更改可能有外部来源,这些来源不是由我们应用程序中的用户操作触发的。使用 Relay,我们可以通过 forceFetching 或 polling 来解决这个问题。中继查询如下所示:Relay <= Server. 我还想有这个数据流:Relay => Redux当外部数据发生变化时。

需要使用新数据更新 Redux 存储的另一个可能原因是,当我们想要同步深度嵌套在 Relay 存储中的数据或复杂查询的一部分时。

例如,考虑对博客文章的评论数。当用户发布新评论时,显示评论计数的另一个组件也应该更新。

如果我们在 Redux 中管理这些信息,我们需要一种方法来在 Relay 查询带有新信息时触发 Redux 操作。我不知道这样的回调,或这种情况的另一种解决方案。

我的问题

在这种情况下,我有这些问题:

  1. 我可以在现有方法中改进什么?我做了什么非常危险/导致不一致的事情吗?(见我的进步
  2. 当出于某种原因更新 Relay 存储时,我如何管理同步 Redux 存储。我正在寻找 React 组件生命周期方法或 Relay 回调,然后我可以将 Redux 操作发送到 Redux 存储。(见未解决的问题