« Max reacjsex » : différence entre les versions
Aucun résumé des modifications |
|||
| Ligne 237 : | Ligne 237 : | ||
export default Adresse;</syntaxhighlight> | export default Adresse;</syntaxhighlight> | ||
==== Explication ==== | |||
* '''Condition <code>{codePos && <Ville ... />}</code>''' : Cette ligne signifie que le composant <code>Ville</code> ne sera rendu que si <code>codePos</code> a une valeur non vide. Si <code>codePos</code> est une chaîne vide (<code>''</code>), alors le composant <code>Ville</code> ne sera pas affiché. | |||
* '''Gestion de l’État''' : Lorsque l’utilisateur saisit quelque chose dans le champ <code>CodePos</code>, l’état <code>codePos</code> est mis à jour, ce qui déclenche un re-rendu du composant <code>Adresse</code>. Si <code>codePos</code> a une valeur, le composant <code>Ville</code> est alors affiché. | |||
Cette approche permet de s’assurer que le champ de la ville n’est visible que lorsque l’utilisateur a saisi un code postal, ce qui peut être utile pour des raisons de logique métier ou d’expérience utilisateur. | |||
<span id="exemple-de-srccomponentszone.jsx"></span> | <span id="exemple-de-srccomponentszone.jsx"></span> | ||
=== Exemple de <code>/src/components/Zone.jsx</code> === | === Exemple de <code>/src/components/Zone.jsx</code> === | ||