Render part of the page only on the client

Category: Components

You can opt out of Server-Side Rendering on the component level.

Just wrap the <ClientOnly> component around the part of template that you want to render client-side only.

<ClientOnly fallback-tag="p" fallback="Loading ...">
  <p>This will get rendered only on the client side.</p>
</ClientOnly>

The fallback-tag and fallback attributes are used as placeholder while the content is being rendered.