Sommaire

Déclarer et typer les propriétés des composants Propriétés

Nous en avons quasiment terminé avec notre découverte de React, mais ce chapitre n’aurait pas été complet si je n’avais pas abordé les PropTypes. Il s’agit d’un moyen de déclarer quelles propriétés attend votre composant, ainsi que leur type. PropTypes

Il existe plusieurs manières de réaliser ce contrôle. Certains développeurs utilisent le langage TypeScript (https://www.typescriptlang.org/docs/handbook/jsx.html) qui permet de typer les variables, paramètres des fonctions, et pour notre cas les propriétés des composants. D’autres utilisent Flow (https://flow.org/en/docs/react/components/) qui permet d’arriver au même résultat. Mais la méthode la plus simple est d’utiliser la bibliothèque PropTypes (https://reactjs.org/docs/typechecking-with-proptypes.html). TypeScript Flow

À l’origine, cette bibliothèque faisait partie intégrante de React. Ce n’est plus le cas, justement pour alléger React dans la mesure où certains développeurs ne l’utilisaient pas, au profit de TypeScript ou Flow. Il faut désormais l’installer à part : yarn add prop-types

Reprenons notre composant Task. Celui-ci attend deux propriétés :

  • task : un objet correspondant à une tâche, comportant un ID, un libellé et un flag indiquant ...