Nuxt/docs/3.api/2.composables/use-id.md

982 B

title description
useId Generate an SSR-friendly unique identifier that can be passed to accessibility attributes.

::important This composable is available since Nuxt v3.10. ::

useId generates an SSR-friendly unique identifier that can be passed to accessibility attributes.

Call useId at the top level of your component to generate a unique string identifier:

<script setup lang="ts">
const id = useId()
</script>

<template>
  <div>
    <label :for="id">Email</label>
    <input :id="id" name="email" type="email" />
  </div>
</template>

::note useId must be used in a component with a single root element, as it uses this root element's attributes to pass the id from server to client. ::

Parameters

useId does not take any parameters.

Returns

useId returns a unique string associated with this particular useId call in this particular component.