app.vue 또는 app/layouts/에 <NuxtRouteAnnouncer/>를 추가하여 페이지 제목 변경 사항을 보조 기술에 알려 접근성을 향상시킬 수 있습니다. 이를 통해 스크린 리더에 의존하는 사용자에게 내비게이션 변경 사항이 안내되도록 보장합니다.
<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)useRouteAnnouncer 컴포저블을 사용하여 내부 알리미 인스턴스에 훅을 걸 수 있으며, 이를 통해 사용자 정의 알림 메시지를 설정할 수 있습니다.