op-error-space
v0.0.2
Published
Vue.js error page component designed for Nuxt.js by Optic Performance™
Downloads
4
Readme
op-error-space
Installation
Npm :
npm install op-error-space
Yarn :
yarn add op-error-space
Setup
Nuxt.js - in ./layout/error.vue
<template>
<!-- Use client-only to avoid server-side rendering errors -->
<client-only>
<op-error-space :error-code="error.statusCode">
<template #info-message>
Powered by Optic Performance™
</template>
<template #redirect-message>
Consider redirecting your user
<nuxt-link to="https://www.optic-performance.com/">somewhere</nuxt-link>
</template>
</op-error-space>
</client-only>
</template>
<script>
import OpErrorSpace from 'op-error-space'
export default {
components: { OpErrorSpace },
layout: 'error',
props: ['error']
}
</script>
Component props
| Prop | Description |
|------------|-------------|
| error-code |Type : Number
Default : 123
The error code to display (can be retrieved via error.statusCode
).|
| background-color |Type : String
Default : #0D0D0D
The background color.|
Component slots
| Slot | Description |
|------------|-------------|
| #info-message |A message to explain the problem.|
| #redirect-message |A message to redirect the user. This slot is intended to display a link with a <a>
or a <nuxt-link>
tag.|