Saltar al contenido

PropTypes en una aplicación TypeScript React

Agradeceríamos tu apoyo para compartir nuestras reseñas con relación a las ciencias informáticas.

Solución:

Typescript y PropTypes sirven para diferentes propósitos. Typescript valida los tipos en tiempo de compilaciónmientras que PropTypes se verifican en tiempo de ejecución.

Typescript es útil cuando está escribiendo código: le advertirá si pasa un argumento del tipo incorrecto a sus componentes React, le dará autocompletado para llamadas a funciones, etc.

Los PropTypes son útiles cuando prueba cómo interactúan los componentes con datos externos, por ejemplo, cuando carga JSON desde una API. PropTypes lo ayudará a depurar (cuando esté en el modo de desarrollo de React) por qué su componente está fallando al imprimir mensajes útiles como:

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

Aunque pueda parecer que Typescript y PropTypes hacen lo mismo, en realidad no se superponen en absoluto. Pero es posible generar PropTypes automáticamente desde Typescript para que no tenga que especificar los tipos dos veces, vea por ejemplo:

  • https://github.com/milesj/babel-plugin-typescript-to-proptypes
  • https://github.com/grncdr/ts-react-loader#qué-hace
  • https://github.com/gcanti/prop-tipos-ts

Por lo general, no tiene mucho valor mantener tanto las propiedades de sus componentes como tipos de TypeScript y React.PropTypes al mismo tiempo.

Estos son algunos casos en los que es útil hacerlo:

  • Publicar un paquete, como una biblioteca de componentes, que utilizará JavaScript simple.
  • Aceptar y transmitir información externa, como los resultados de una llamada a la API.
  • Usar datos de una biblioteca que puede no tener tipos adecuados o precisos, si los hay.

Por lo tanto, generalmente es una cuestión de cuánto puede confiar en su validación de tiempo de compilación.

Las versiones más recientes de TypeScript ahora pueden inferir tipos según su React.PropTypes (PropTypes.InferProps), pero los tipos resultantes pueden ser difíciles de usar o consultar en otras partes de su código.

Supongo que en algunas situaciones complicadas en las que el tipo de accesorios no se puede inferir en el momento de la compilación, sería útil ver las advertencias generadas por el uso propTypes en tiempo de ejecución.

Una de esas situaciones sería cuando se procesan datos de una fuente externa para la cual las definiciones de tipo no están disponibles, como una API externa fuera de su control. Para las API internas, creo que vale la pena escribir (o mejor, generar) definiciones de tipo, si aún no están disponibles.

Aparte de eso, realmente no veo ningún beneficio (por lo que nunca lo he usado personalmente).

Comentarios y calificaciones

Si para ti ha resultado provechoso nuestro post, sería de mucha ayuda si lo compartieras con más entusiastas de la programación de esta forma nos ayudas a extender esta información.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *