GitHub - ten1seven/what-input: A global utility for tracking the current input method (mouse/pointer, keyboard or touch).You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
【React】useIdの使い方を調べていたらアクセシビリティの世界に片足突っ込んだ話
概要 普段同じようなhooksを使っていてマンネリ化してきているため、今一度、Reactにはどんなhooksがあるのか調べているとReact v18から導入されたuseId()というものを見つけた。 コンポーネントごとに一意のIdを生成できるhooksらしいが、イマイチ使い所がわからなかったので、調べていくとアクセシビリティの世界に踏み入ることになりました。 深くて軽く溺れかけたので、ざっくりメモがてらまとめます。 useIdの構文について 構文 引数はなく、戻り値は一意のID文字列である。 注意事項として、useId()はコンポーネントレベルで一意のIdを生成するため、mapなどのリスト表示の際のキーの生成には使えない。 公式にも、キーはデータから生成される必要があると記述されている。 ❌ const Test = () => { const id = useId(); return (
SPAでボタンコンポーネントをリンクにする時に気をつけること
この記事はVueアドベントカレンダー2021の7日目の記事です。 SPAでボタンのコンポーネントをリンクとして扱いたいときに気をつけたいことを書きます。 Vueに限った話ではないのですが、僕がVueで開発をする機会が多いのでサンプルコードではVueを使用しています。 他のフレームワークを使っている方は、適宜置き換えて考えていただければ幸いです。 ボタンのコンポーネントでリンクさせたい時ありますよね？ Vue Routerを使用していれば router.push('/foo') のように関数を実行して遷移させることができるので、コンポーネントの内部が aタグ でも buttonタグ でもリンクとして動作させることが可能です。 どちらでもできるけど aタグ を使おうぜというのが本記事の言いたいことです！ サンプル 早速ですが、サンプルを使って紹介していきます。 見た目の同じボタンが2つ並んでい
アクセシビリティオブジェクトモデル
アクセシビリティオブジェクトモデル 著者: Alice Boxhall, Google, aboxhall@google.com James Craig, Apple, jcraig@apple.com Dominic Mazzoni, Google, dmazzoni@google.com Alexander Surkov, Mozilla, surkov.alexander@gmail.com Table of Contents はじめに モチベーションとなるユースケース アクセシビリティオブジェクトモデル ARIA属性を反映する Spec/implementation status 要素の参照を反映する ユースケース 2: IDREFsを使用することなく関係プロパティを設定する Spec/implementation status ElementInternalsオブジェクトによるカ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
