useID در vue 3.5

گاها پیش میاد که میخوام یک id منحصر به فرد بسازیم تا ازش برای form ها یا accessibility attributes ها استفاده کنیم. تا قبل از این میتونستیم از کتابخانه هایی مثل uuid استفاده کنیم ولی از نسخه ی 3.5 میتونیم از useId استفاده کنیم:

<script setup>import { useId } from 'vue'const id = useId()</script><template>  <form>    <label :for="id">Name:</label>    <input :id="id" type="text" />  </form></template>

این composable برای app instance شناسه های منحصر بفرد درست میکنه، اگر توی صفحه بیش از یک app instance داشتیم میتونیم با app.config.idPrefix یک پیشوند برای آی دی هر نمونه app اضافه کنیم. توی حالت پیشفرض این پیشوند v_ هست. مثلا v-0 و v-1 و الی آخر…

این composable رو چند ساله توی react داشتیم (البته اونجا بهش میگن hook) و خوبه که از الان به بعد توی vue هم داریم.

منبع: