この記事は『WAI-ARIA対応のタブ型UIを実装する方法』の続きです。 WAI-ARIAはアクセシビリティーの改善に役立つと先の記事で紹介しました。この記事ではWAI-ARIAに対応したReactでのタブのユーザーインタフェースを解説します。 サンプルをGitHubにアップしているので、デモとソースコードをご覧ください。 別ウインドウで再生する GitHubでコードを確認する 前提として、create-react-appを使って環境構築したものとします。 create-react-appを使っていなくても、記事「最新版で学ぶwebpack入門 - BabelでES2018環境の構築(Reactのサンプル付き)」で紹介しているようにwebpack等で環境構築されていても構いません。 Reactでのステート管理 実装の要素としてstateに選択されたタブのIDを保持することとします。 ▼ステ