reactjs - Apollo GraphQL 本地和全局错误处理

Question

我正在使用 Apollo 与 React 编写的 Web 应用程序中的 GraphQL 服务器进行交互。我正在尝试在应用程序中实现错误处理并依赖 apollo-link-error为此。

现在，我需要处理两类错误:

1. 可以在执行 Apollo 查询或突变的组件中本地处理的错误，即我需要在其上显示上下文错误信息的无效表单字段
2. 可以全局处理的错误，例如通过在页面某处显示错误详细信息的 Toast 通知

显然，一旦错误在本地处理，我就需要不在全局处理它，因为在表单字段旁边显示错误消息没有多大意义和 通过 toast 消息的一般错误。

我在尝试实现此功能时遇到的第一个绊脚石是全局错误处理逻辑在本地错误处理逻辑之前触发，这使我无法在本地拦截错误然后查找一种防止全局逻辑启动的方法。

我创建了codesandbox示例，它以最简单的方式设置了ApolloClient，使用http和错误链接，并使用react-apollo Query 组件查询不存在的资源，生成错误。

我正在 Query 组件的 onError 回调(本地错误处理)和 apollo-link-error 中处理错误 处理程序(全局错误处理)，并将错误打印到控制台。

它表明全局错误处理逻辑在本地错误处理之前启动。我需要它是相反的。

Answer 1

我发布了一个名为 react-apollo-network-status 的库它正好处理这个用例。如果对您有用，请告诉我!

本地处理某些错误的选择加入/退出行为是通过在操作上设置上下文变量来实现的，该变量可以在错误链接中读取。