通过 100 多个技巧学习 Nuxt!

useRouteAnnouncer

此组合项观察页面标题更改并相应地更新播音器消息。
此组合项在 Nuxt v3.12+ 中可用。

描述

一个组合项,用于观察页面标题更改并相应地更新播音器消息。被 <NuxtRouteAnnouncer> 组件使用并且可控。它挂钩到 Unhead 的 dom:rendered 以读取页面的标题并将其设置为播音器消息。

参数

  • politeness: 设置屏幕阅读器公告的紧急程度:off (禁用公告), polite (等待静默), 或 assertive (立即中断). (默认 polite).

属性

message

  • 类型: Ref<string>
  • 描述: 要公告的消息

politeness

  • 类型: Ref<string>
  • 描述: 屏幕阅读器公告紧急级别 off, polite, 或 assertive

方法

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>