mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-16 02:44:51 +00:00
dc47c64f14
Co-authored-by: Daniel Roe <daniel@roe.dev> Co-authored-by: Sébastien Chopin <seb@nuxtjs.com> Co-authored-by: Pooya Parsa <pooya@pi0.io> Co-authored-by: pooya parsa <pyapar@gmail.com> Co-authored-by: Clément Ollivier <clement.o2p@gmail.com>
39 lines
964 B
Markdown
39 lines
964 B
Markdown
---
|
|
title: "<NuxtErrorBoundary>"
|
|
description: The <NuxtErrorBoundary> component handles client-side errors happening in its default slot.
|
|
---
|
|
|
|
# `<NuxtErrorBoundary>`
|
|
|
|
The `<NuxtErrorBoundary>` component handles client-side errors happening in its default slot, using Vue's [`onErrorCaptured` hook.](https://vuejs.org/api/composition-api-lifecycle.html#onerrorcaptured)
|
|
|
|
## Events
|
|
|
|
- **`@error`**: Event emitted when the default slot of the component throws an error.
|
|
|
|
```vue
|
|
<template>
|
|
<NuxtErrorBoundary @error="logSomeError">
|
|
<!-- ... -->
|
|
</NuxtErrorBoundary>
|
|
</template>
|
|
```
|
|
|
|
## Slots
|
|
|
|
- **#error**: Specify a fallback content to display in case of error.
|
|
|
|
```vue
|
|
<template>
|
|
<NuxtErrorBoundary>
|
|
<!-- ... -->
|
|
<template #error="{ error }">
|
|
<p>An error occurred: {{ error }}</p>
|
|
</template>
|
|
</NuxtErrorBoundary>
|
|
</template>
|
|
```
|
|
|
|
::ReadMore{link="/getting-started/error-handling"}
|
|
::
|