reactjs / reactjs/react-docgen
Complex composition using `PropTypes.shape`
Nessuno ha ancora preso questa issue.
- Lingua principale
- TypeScript
- Stelle
- 3.8k
- Fork
- 316
- Merge medio
- 5h 7m
- PR unite (30g)
- 4
Descrizione
I have a component that looks something along the lines of
import A from './A';
import B from './B';
class MyComponent extends Component {
...
}
MyComponent.propTypes = {
aProps: PropTypes.shape(A.propTypes),
bProps: PropTypes.shape(B.propTypes),
...
};
Is there a way to make the parser detect that this is a composition rather than simple prop shapes?
I'm doing this because I don't want all the props to live on the wrapper component's scope but to contain each in their own prop, mainly to be able to distinguish what goes where so I don't accidentally pass props that both A and B may have but in reality shouldn't be the same like className, style, children, etc.
I would also like to know if this is possible:
import A from './A';
import VariantOfA from './VariantOfA';
class MyComponent extends Component {
...
}
MyComponent.propTypes = {
aProps: PropTypes.oneOfType([PropTypes.shape(A.propTypes),PropTypes.shape(VariantOfA.propTypes)])
...
};
In this scenario I want to be able to represent with a single prop both A and VariantOfA because essentially they are the same with minor differences in prop types.
I would assume this could be the same for PropTypes.arrayOf and PropTypes.objectOf since they're not that different from PropTypes.oneOfType
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Direzione di ricerca
L’issue non indica file, test o punti di ingresso del parser, quindi per prima cosa traccia come vengono gestiti attualmente PropTypes.shape, oneOfType, arrayOf e objectOf. Confronta gli esempi richiesti di componenti annidati e varianti con la documentazione generata e definisci l’output atteso e i test prima dell’implementazione.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- javascript, react
- Ambito
- documentation, tooling
- Tipo di issue
- Funzionalità
- Difficoltà
- 5/5
- Tempo stimato
- Più di una settimana
- Stato di attività
- Ferma
- Chiarezza
- Da chiarire
- Idoneità per principianti
- 25/100