使用@apollo/react-hooks，react 应用程序在刷新过期时严重崩溃答案

【问题标题】：Using @apollo/react-hooks, the react app crashes hard on refresh being expired使用@apollo/react-hooks，react 应用程序在刷新过期时严重崩溃
【发布时间】：2020-09-22 16:37:59
【问题描述】：

当我未登录时，我收到此错误：

Unhandled Rejection (Error): GraphQL error: Refresh has expired

它发生在这个代码块中：

  const { loading, error, data } = useQuery(GET_BILLABLE_EVENTS, {
    fetchPolicy: 'no-cache',
    errorPolicy: 'ignore',
    onError: (err) => {
      console.log({ err });
    },
  });
  return <div>hello</div>;

我真的希望它能够被优雅地处理，但它只会使 React 崩溃并抛出错误，尽管选项中设置了错误策略和 onError。

重新启动 create-react-app 时，似乎卡在了这个错误循环中。

【问题讨论】：

标签： reactjs react-apollo react-apollo-hooks

【解决方案1】：

您不能在到达 useQuery 之前检查用户是否经过身份验证吗？

我认为你应该能够通过将组件包裹在“错误边界”周围来优雅地处理它

From react documentation

错误边界是 React 组件，它们在其子组件树的任何位置捕获 JavaScript 错误，记录这些错误，并显示后备 UI 而不是崩溃的组件树。错误边界在渲染期间、生命周期方法中以及它们下方的整个树的构造函数中捕获错误。

<ErrorBoundary>
  <App />
</ErrorBoundary>

ErrorBoundary Example

【讨论】：