4.11 traitement de la soumission du formulaire
Maintenant nous pourrions ajouter un écouteur
de cliquer ici à son button de dépenses
mais ça ne sera pas la meilleure façon d'écouter ici
car en effet il existe un comportement
par défaut intégré au navigateur et au form
sur les pages web c'est donc sur ce form je veux réagir
lors de la soumission et ensuite exécuter une fonction
chaque fois que ce form et soumis
du coup dans forme on rajoute onSubmit comme ceci
maintenant c'est une annonce fonctionnelle ici
et je la nommerais submitHandler
et puis si nous nous concentrons simplement
sur submitHandler comme nous l'avons fait
pour tous les événements également
à l'interieur vous marquer submitHandler
on va rajouter dedans event et entre les crocher on va mettre event point prévente défault
du coup sûr cet objet on a rajouté une méthode de prévention prévente défaut toujours à l'intérieur
juste pour expliqué c'est quoi la méthodes preventDefault
c'est rattachée à l'interface Event , indique à l'agent utilisateur que si l'évènement n'est pas explicitement géré, l'action par défaut
ne devrait pas être exécutée comme elle l'est normalement.
de const on va rajouter un nouveau const dépenseData
et on mais les crochets disont que l'objet
des données de dépenses ici et maintenant combiné
à toutes les données saisies
bien sûr si vous utilisez cette approche a un état
au lieu d'être libre vous avez déjà un tel objet
qui est ici mais je ne l'ai pas ici
je vais t'envoie maintenant créer une fois
le formulaire soumis et ajouter simplement un titre ici
et définir ceci sur la valeur stocké dans l'état du titre
saisie a une propriété de mon temps à l'interieure
de dépenseData on va rajouter title enteredTitle vous mettez une virgule en dessous on va rajouter
Amount ici on va rajouter enteredAmount
et ici par contre on va rajouter un new dates
nouvelles dates entre parenthèses
on va mettre enteredDate
maintenant nous avons ses noms de propriété ici et ici
depende de vous parce que c'est votre objet
maintenant juste entre les deux crochers
on va rajouter un console.log entre parenthèses
expense data
pardon excusez moi c'est dépense data comme ceci.
et si vous allez sur votre site web et que vous tester les fonctionnalités convient d'ajouter normalement dans votre adresse
afficher on se retrouve pour le prochain cour.