CODEWITHSUNDEEP
vue.jsnuxt.jshttp-status-code-404
XingGuang Zhen
XingGuang Zhen

Reputation: 21

Vue/Nuxt 404 Page customize

Hello I am developing a vue/nuxt website. I have designed 404 not found page. but I am not sure how to show this page when user type the URL that I can't find.

Upvotes: 2

Views: 2049

Answers (1)

tho-masn
tho-masn

Reputation: 1174

You can just create a layout file (layouts/error.vue), which handles errors automatically. In this file you can decide, if you only want to handle 404 errors, or also other errors.

<template>
  <div>
    <h1 v-if="error.statusCode === 404">
      Not found
    </h1>
    <h1 v-if="error.statusCode !== 404">
      Error
    </h1>
  </div>
</template>

<script>
export default {
  layout: 'default',
  props: {
    error: {
      type: Object,
      required: true
    }
  }
}
</script>

Reference: https://nuxtjs.org/docs/2.x/concepts/views#error-page

Upvotes: 2

Related Questions