使用法

<NuxtRouteAnnouncer/> を app.vue または app/layouts/ に追加して、支援技術にページタイトルの変更を知らせることでアクセシビリティを向上させます。これにより、スクリーンリーダーに依存するユーザーにナビゲーションの変更が通知されます。

<template>
  <NuxtRouteAnnouncer />
  <NuxtLayout>
    <NuxtPage />
  </NuxtLayout>
</template>

スロット

ルートアナウンサーのデフォルトスロットを通じてカスタムHTMLやコンポーネントを渡すことができます。

  <template>
    <NuxtRouteAnnouncer>
      <template #default="{ message }">
        <p>{{ message }} was loaded.</p>
      </template>
    </NuxtRouteAnnouncer>
  </template>

プロップ

• atomic: スクリーンリーダーが変更のみをアナウンスするか、全コンテンツをアナウンスするかを制御します。更新時に全コンテンツを読み上げるには true に設定し、変更のみの場合は false に設定します。（デフォルトは false）
• politeness: スクリーンリーダーのアナウンスの緊急度を設定します：off（アナウンスを無効にする）、polite（静寂を待つ）、または assertive（即座に中断する）。（デフォルトは polite）