Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12 日至 13 日。
生成一个对服务器端渲染友好的唯一标识符,可以传递给辅助功能属性。
此可组合函数自 Nuxt v3.10 起可用。

useId 生成一个对服务器端渲染友好的唯一标识符,可以传递给辅助功能属性。

在组件的顶层调用 useId 以生成唯一的字符串标识符

components/EmailField.vue
<script setup lang="ts">
const id = useId()
</script>

<template>
  <div>
    <label :for="id">Email</label>
    <input :id="id" name="email" type="email" />
  </div>
</template>
useId 必须在具有单个根元素的组件中使用,因为它使用此根元素的属性将 ID 从服务器传递到客户端。

参数

useId 不接受任何参数。

返回值

useId 返回与此特定组件中此特定 useId 调用关联的唯一字符串。