<NuxtClientFallback>
Nuxt provides `<NuxtClientFallback>` component to render its content on the client if any of its children trigger an error in SSR
This component is experimental and in order to use it you must enable the
experimental.clientFallback
option in your nuxt.config
.Events
@ssr-error
: Event emitted when a child triggers an error in SSR. Note that this will only be triggered on the server.<template> <NuxtClientFallback @ssr-error="logSomeError"> <!-- ... --> </NuxtClientFallback></template>
Props
placeholderTag
|fallbackTag
: Specify a fallback tag to be rendered if the slot fails to render.- type:
string
- default:
div
- type:
placeholder
|fallback
: Specify fallback content to be rendered if the slot fails to render.- type:
string
- type:
keepFallback
: Keep the fallback content if it failed to render server-side.- type:
boolean
- default:
false
- type:
<template> <!-- render <span>Hello world</span> server-side if the default slot fails to render --> <NuxtClientFallback fallback-tag="span" fallback="Hello world"> <BrokeInSsr /> </NuxtClientFallback> </template>
Slots
#fallback
: specify content to be displayed server-side if the slot fails to render.
<template> <NuxtClientFallback> <!-- ... --> <template #fallback> <!-- this will be rendered on server side if the default slot fails to render in ssr --> <p>Hello world</p> </template> </NuxtClientFallback></template>