<SignedOut />

The SignedOut component renders its default slot only when the user is not authenticated. It is auto-registered by the Nuxt module.

Usage

Basic Usage

pages/index.vue

<template>
  <SignedOut>
    <SignInButton />
  </SignedOut>
</template>

Fallback Slot

Use the fallback slot to show content when the user is signed in:

components/NavBar.vue

<template>
  <SignedOut>
    <SignInButton />
    <template #fallback>
      <UserDropdown />
    </template>
  </SignedOut>
</template>

Slots

Slot	Description
default	Content rendered when the user is not authenticated
fallback	Content rendered when the user is authenticated