Slide 1
Slide 1 text
ハードコード不要 !!
ID 衝突なし !!
SSR 対応 !!
接頭辞の変更可 !!
注意点
` リスト内keyでuseIdを使わなY
` SSR時は同一ツリーで呼び出す
React 18からのAPI useId() を使おう!!
他ライブラリでも採用
useId() の詳細は を参照
https://ja.react.dev/reference/react/useId
React 19.1からID属性値の出力結果が :xxxx: から «xxxx» へ変更された
View Transition APIやCSS Anchor Positionで使用時の不具合を解消
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import from
function
const
return
label
input
label
p
p
{ useId } ;
() {
passwordHintId ();
(
<>
< >
パスワード
< type="password" aria-describedby={passwordHintId} />
< id={passwordHintId}>
パスワードは18文字以上の入力が必要です
);
};
'react'
PasswordField
useId
=