🤓
vueでreactのuseIdのようにunique idを生成する
🤓

vueでreactのuseIdのようにunique idを生成する

getCurrentInstance().uidを使用

フロントエンドでコンポーネント内にidがある場合、idが重複してしまいます。
これを防止するために、reactではuseIdを使用します。
vueでも似たようなものがあるか調べてみたら、以下のようにgetCurrentInstance().uidを知りました。
 
import { getCurrentInstance } from 'vue';
const uid = getCurrentInstance().uid;
 

参考にした資料

フロントエンドid属性管理戦略
フロントエンドid属性管理戦略
https://zenn.dev/yusukehirao/articles/id-attribute-strategy
フロントエンドid属性管理戦略
React 18のuseIdでアクセシビリティ向上（WAI-ARIAのRelationship attributes） - Qiita
この記事の概要 React 18で新しくuseIdというhooksが使えるようになりました。 コンポーネントにWAI-ARIAを導入するにあたって、便利になると思ったのでいくつかのパターンを紹介します。 また、Qiita Engin...
React 18のuseIdでアクセシビリティ向上（WAI-ARIAのRelationship attributes） - Qiita
https://qiita.com/xrxoxcxox/items/2c498537292c6388cb80
React 18のuseIdでアクセシビリティ向上（WAI-ARIAのRelationship attributes） - Qiita
Is there an equivalent to React's useId hook in Vue.js?
In React there is a really handy hook called useId that helps ensure HTML IDs are unique across the DOM. I'm wondering if there's anything similar in the Vue ecosystem? https://beta.reactjs.org/apis/
Is there an equivalent to React's useId hook in Vue.js?
https://stackoverflow.com/questions/74914835/is-there-an-equivalent-to-reacts-useid-hook-in-vue-js
Is there an equivalent to React's useId hook in Vue.js?