javascript - Apollo 客户端( react ): Handling unexpected errors

Question

我一直在查看 Apollo 文档，但没有看到有关如何在 Apollo 客户端中处理服务器错误的信息。

例如，假设服务器:

• 超时
• 变得无法访问
• 意外失败

客户端应该如何处理？ Apollo 当前失败并出现如下错误:

Unhandled (in react-apollo) Error: GraphQL error: Cannot ...

我想避免这种情况发生并处理这些错误。我如何使用 React Apollo 做到这一点？

---

供引用:

我目前正在使用 React-Apollo 和 Redux。

Answer 1

错误在组件属性的 error 字段中传递:http://dev.apollodata.com/react/api-queries.html#graphql-query-data-error

function MyComponent({ data }) {
  if (data.error) {
    return <div>Error!</div>;
  } else {
    // ...
  }
}

export default graphql(gql`query { ... }`)(MyComponent);

如果我们检测到有错误并且未在组件中访问 error 字段，则会打印该消息。

您可以编写一个高阶组件以通用方式处理错误，这样您就可以用它包装所有组件。