通过客户端导航到 nuxt 错误页面?

Jay*_*rds 1 vue.js vue-router axios nuxt.js

当我使用 nuxt 部署通用应用程序时,我注意到引发异常的客户端 $axios 请求只是将错误代码返回到控制台。有没有办法让 nuxt 重定向到我们在 layouts 文件夹中指定的 error.vue ?我似乎只能通过调用context.error服务器端的方法才能到达此页面。

我一直在接近它如下:

async submit (evt) {
  try {
    const { data } = await this.$axios.get(`some/url`)
    ...
  } catch (e) {
    throw new Error(e) // assume, for the sake of argument, that the error is: { 'statusCode': 403, 'message': 'Forbidden' }
  }
}
Run Code Online (Sandbox Code Playgroud)

Ali*_*ini 5

在你catch可以通过重定向用户的错误页面

    return this.$nuxt.error({ statusCode: 404, message: 'err message' })
Run Code Online (Sandbox Code Playgroud)

在您的error.vue页面中,您可以使用以下error道具访问它:

<h1>{{ error.statusCode }}</h1>
<h2>{{ error.message }} </h2>
Run Code Online (Sandbox Code Playgroud)