PropTypes in un'applicazione TypeScript React

L'utilizzo ha React.PropTypessenso in un'applicazione TypeScript React o è solo un caso di "cintura e bretelle"?

Poiché la classe del componente è dichiarata con un Propsparametro di tipo:

interface Props {
    // ...
}
export class MyComponent extends React.Component<Props, any> { ... }

c'è qualche vantaggio reale nell'aggiungere

static propTypes {
    myProp: React.PropTypes.string
}

alla definizione di classe?

Di solito non c'è molto valore nel mantenere entrambi gli oggetti di scena del componente come tipi TypeScript e React.PropTypesallo stesso tempo.

Ecco alcuni casi in cui è utile farlo:

• Pubblicazione di un pacchetto come una libreria di componenti che verrà utilizzata da JavaScript normale.
• Accettazione e trasmissione di input esterni come i risultati di una chiamata API.
• Utilizzo di dati da una libreria che potrebbe non avere digitazioni adeguate o accurate, se presenti.

Quindi, di solito è una questione di quanto ci si può fidare della convalida in fase di compilazione.

Le versioni più recenti di TypeScript possono ora dedurre i tipi in base al tuo React.PropTypes( PropTypes.InferProps), ma i tipi risultanti possono essere difficili da usare o fare riferimento altrove nel tuo codice.

Typescript e PropTypes hanno scopi diversi. Typescript convalida i tipi in fase di compilazione , mentre PropTypes viene controllato in fase di esecuzione .

Il typescript è utile quando scrivi codice: ti avviserà se passi un argomento del tipo sbagliato ai tuoi componenti React, ti darà il completamento automatico per le chiamate di funzione, ecc.

I PropTypes sono utili quando testate come i componenti interagiscono con i dati esterni, ad esempio quando caricate JSON da un'API. PropTypes ti aiuterà a eseguire il debug (quando sei in modalità Sviluppo di React) perché il tuo componente non funziona stampando messaggi utili come:

Warning: Failed prop type: Invalid prop `id` of type `number` supplied to `Table`, expected `string`

Anche se può sembrare che Typescript e PropTypes facciano la stessa cosa, in realtà non si sovrappongono affatto. Ma è possibile generare automaticamente PropTypes da Typescript in modo da non dover specificare due volte i tipi, vedi ad esempio:

• https://github.com/milesj/babel-plugin-typescript-to-proptypes
• https://github.com/grncdr/ts-react-loader#what-it-does
• https://github.com/gcanti/prop-types-ts

Immagino che in alcune situazioni disordinate in cui il tipo di oggetti di scena non può essere dedotto in fase di compilazione, sarebbe utile vedere eventuali avvisi generati dall'utilizzo propTypesin fase di esecuzione.

Una di queste situazioni potrebbe verificarsi durante l'elaborazione dei dati da un'origine esterna per la quale le definizioni del tipo non sono disponibili, ad esempio un'API esterna al di fuori del tuo controllo. Per le API interne, penso che valga la pena scrivere (o meglio, generare) definizioni di tipo, se non sono già disponibili.

A parte questo, non vedo alcun vantaggio (motivo per cui non l'ho mai usato personalmente).