reactjs / reactjs/react-tabs

Support hiding of all TabPanels

Aperta
#525 1 commento 1 reazione 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Lingua principale
JavaScript
Stelle
3.1k
Fork
455
Merge medio
5h 9m
PR unite (30g)
2

Descrizione

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?

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia tracciando il modo in cui react-tabs gestisce defaultIndex e come il rendering di TabPanel reagisce quando non è selezionata alcuna scheda. Definisci il comportamento di defaultIndex={null}, inclusa l’attivazione dopo la selezione di una scheda, e copri con dei test sia lo stato inizialmente vuoto sia la selezione successiva.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
javascript, react
Ambito
accessibility, frontend
Tipo di issue
Funzionalità
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.