透過 100 多個訣竅學習 Nuxt!

useRouteAnnouncer

此組合式函式會觀察頁面標題的變更,並相應地更新廣播訊息。
此組合式函式適用於 Nuxt v3.12+。

描述

一個組合式函式,會觀察頁面標題的變更,並相應地更新廣播訊息。由 <NuxtRouteAnnouncer> 使用且可控制。它會掛接到 Unhead 的 dom:rendered 以讀取頁面的標題並將其設定為廣播訊息。

參數

  • politeness:設定螢幕閱讀器宣告的緊急程度:off(停用宣告)、polite(等待靜默),或 assertive(立即中斷)。(預設為 polite)。

屬性

message

  • 類型Ref<string>
  • 描述:要宣告的訊息

politeness

  • 類型Ref<string>
  • 描述:螢幕閱讀器宣告的緊急程度:offpoliteassertive

方法

set(message, politeness = "polite")

設定要宣告的訊息及其緊急程度。

polite(message)

設定訊息,且 politeness = "polite"

assertive(message)

設定訊息,且 politeness = "assertive"

範例

pages/index.vue
<script setup lang="ts">
  const { message, politeness, set, polite, assertive } = useRouteAnnouncer({
    politeness: 'assertive'
  })
</script>