Javascript Nuxt和Vue阿波罗。如何通过重定向到404/400/500错误页面处理智能查询中的错误？我们能抓住这样的错误吗？

对于常规HTTP请求，我们可以使用asyncData（{error}）{…}创建重定向

我们应该使用什么来使用智能查询重定向到400页

有了Vue Apollo，我正在尝试使用

阿波罗：{ queryName：{ 预回迁：对， 查询：错误查询， 错误（错误数据）{ 这是$numxt.error({ 状态代码：500， 消息：“错误消息”， }); }, }, }; 如果我们重新加载页面，重定向将不起作用。由于服务器端渲染，我们仍然出现错误：

使用全局错误处理程序，如：

///plugins/apollo-error-handler.js
导出默认值（{graphQLErrors，networkError，operation，forward}，nuxtContext）=>{
console.log（networkError）
nuxtContext.error({
状态代码：404，
消息：“错误消息”，
});
};

只有错误日志记录才有效。重定向根本不起作用

我们有没有办法处理智能查询中的错误，比如重定向到400页

---

我们能在智能查询中捕捉到这样的错误吗？就像试…抓。。。在asyncData（）中防止应用程序崩溃。

像这样的智能查询非常有限，因此，我更喜欢在Vuex应用商店中处理它。不确定这是否是最好的做法，但现在对我来说效果很好

异步niceFancyVuexAction（{dispatch}，{fancyInput}）{
试一试{
const{errors，data}=等待this.app.apolloProvider.defaultClient.mutate({
突变：你的图形在这里突变，
错误策略：“全部”，
变量：{
输入：fancyInput，
},
})
如果（错误）{
返回调度（'handleErrors'，'我们有一些错误'）
}
dispatch（'anotherNiceFancyVuexAction'，data.Address.createForCompany）
console.log（'success！'）
}捕获（错误）{
//在这里，您可以捕获错误并进行重定向
调度（'handleErrors'，'呼叫未成功'）
}
},

否则，使用

onError

链接也是一个好主意，如果您想配置它：

我找到了解决方案

希望这个答案对你有帮助

---

干杯

谢谢你的回答。如何处理加载状态？通过智能查询，我们可以使用此。$apollo.loading来显示微调器。如果你接近我们该怎么办？谢谢你的赏金！在本例中，我确实将vuex操作调用到

fetch（）

nuxt钩子中，并使用

$fetchState.pending

helper:但可能还有一个

加载

变量可以从graphql调用中解构，但没有选中此变量。

export default function ({ redirect }) {
  const link = onError(({ graphQLErrors, networkError }) => {
  if (graphQLErrors) {
    graphQLErrors.map(({ message }) => {
      if (`${message}` === 'Unauthenticated.') {
        redirect('/login')
        // Do Something
        localStorage.setItem('logged', false)
      }
    })
  }
  if (networkError) {
    console.log(`[Network error]: ${networkError}`)
  }
})
  return {
    defaultHttpLink: false,
    link: ApolloLink.from([link, createHttpLink({
      credentials: 'include',
      uri: 'http://localhost:8000/graphql',
      fetch: (uri, options) => {
        options.headers['X-XSRF-TOKEN'] = Cookies.get('XSRF-TOKEN')
        return fetch(uri, options)
      }
    })]),
    cache: new InMemoryCache()
  }
}`