Support hiding of all TabPanels

オープン

#525 2023年7月22日に作成コメント 1 件リアクション 1 件担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度: 4/5
見積もり時間: 3〜5日
初心者へのやさしさ: 35/100

issue の種類: 機能追加
明瞭さ: おおむね明確
活発さ: 停滞
技術スタック: javascript, react
領域: accessibility, frontend

調査の方向性

まず、react-tabs が defaultIndex をどのように処理するか、またタブが選択されていない場合に TabPanel のレンダリングがどのように応答するかを追跡します。defaultIndex={null} の動作を定義し、タブ選択後のアクティベーションを含め、初期状態が空の場合とその後の選択の両方をテストで網羅します。

索引モデルが issue の本文から書いたものです。

説明

Firstly, thanks for this great lib. The focus on a11y is a huge +1.

The UI I'm aiming for is a tab-strip with all the tab panels closed, and a tab is activated only when the user selects a tab. It looks like react-tabs doesn't currently support hiding all the tab panels.

I searched the issues here to find #287, but this seems to be using a CSS-only solution. This will still cause the DOM to have the tab panel. This not only adds unnecessary stuff to the DOM (my tab panel could have a lot of DOM nodes), but also fires off the rendering lifecycle of the tab panel's contents, including all the hooks for that panel. In my case, this would trigger network requests and such, which I would like to avoid.

Would it be possible to build support for something like defaultIndex={null}, so that all tab panels can be hidden away until needed?

主要言語: JavaScript
スター: 3.1k
フォーク: 455
平均マージ: 5時間 9分
マージ済み PR（30日）: 2

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

はじめの一歩

issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
リポジトリをフォークし、ブランチを切って変更します。
issue 番号を参照したプルリクエストを送ります。

reactjs/react-tabs のほかの issue

Tab not updating properly when state changes dynamically オープン

難易度 3/5 1〜2日初心者へのやさしさ 25/100

reactjs/react-tabs#584 · 2025年7月27日に作成
className default is lost when props.className is undefined in UncontrolledTabs オープン

難易度 2/5 1〜3時間初心者へのやさしさ 45/100

reactjs/react-tabs#581 · コメント 3 件 · 2025年5月28日に作成
Can I get the width of the dom of the first selected tab? オープン

難易度 3/5 1〜2日初心者へのやさしさ 35/100

reactjs/react-tabs#571 · 2024年12月19日に作成
Disabled tabs should remain keyboard focusable as per W3C WAI ARIA guidelines オープン

難易度 3/5 1〜2日初心者へのやさしさ 35/100

reactjs/react-tabs#521 · コメント 3 件 · 2023年6月7日に作成
React-tabs dropped clicks on tab switch when inspecting on mobile device オープン

難易度 3/5 1〜2日初心者へのやさしさ 42/100

reactjs/react-tabs#507 · コメント 1 件 · 2023年1月10日に作成

reactjs/react-tabs の issue をすべて見る

似ている issue

[feature] OnlyBigBottleTurbo 检查大小瓶数量问题オープン

enhancement

難易度 2/5 1〜3時間初心者へのやさしさ 70/100

babalae/bettergi-scripts-list#3674 · 2026年9月21日に作成
< Polycule > client description does not adhere to the Foundation's branding guidelines オープン

ecosystem wording

難易度 1/5 1時間未満初心者へのやさしさ 90/100

matrix-org/matrix.org#3649 · 2026年9月21日に作成
`minWidth` and `maxWidth` accept percentages the docs say are unsupported オープン

難易度 2/5 1〜3時間初心者へのやさしさ 88/100

vadimdemedes/ink#1029 · 2026年9月20日に作成
[Duplicate Code] Repeated filtered model-alias assembly in proxy server オープン

code-quality refactoring

難易度 2/5 1〜3時間初心者へのやさしさ 84/100

github/gh-aw-firewall#8816 · 2026年9月20日に作成
quickjs: support `timeout=None` (no per-call deadline) in `CodeInterpreterMiddleware` オープン

integration:quickjs org:external priority:backlog topic:code-interpreter topic:middleware type:feature

難易度 2/5 1〜3時間初心者へのやさしさ 74/100

langchain-ai/deepagents#6450 · 2026年9月20日に作成

JavaScript の issue をもっと見る