Pour cela, je suis de retour dans cette application sur laquelle nous avons travaillé, cette application d'objectifs où nous pouvons
ajouter des objectifs ici et voici le code que nous avons écrit là-bas, je n'y ai rien changé.
Maintenant, permettez-moi de présenter les différentes choses qui pourraient mal tourner et comment vous les corrigez.
Commençons donc simplement, disons
que nous avons une erreur de syntaxe simple, ici où nous ouvrons notre modal à la fin en définissant le
mode d'ajout
sur true, permettez-moi de supprimer ce crochet de fermeture. Maintenant, c'est une erreur de syntaxe claire, c'est une erreur que nous
pouvons et que nous devons totalement éviter car en tant que développeur, nous avons fait une erreur claire.
Maintenant, la bonne chose est que notre IDE le reconnaît et nous donne un avertissement ici, mais malheureusement, l'erreur
qu'il montre ici n'est pas entièrement correcte,
il dit qu'il attend une virgule, eh bien en
fait ce n'est pas le vrai problème, le vrai problème est un support manquant.
Pourtant, nous avons une idée que quelque chose ne va pas
ici et bien que vous ayez encore besoin de réfléchir au problème et que vous ne puissiez pas utiliser aveuglément cette solution
en regardant ce code, à un moment donné, vous devriez découvrir qu'il manque un support.
Même si vous oubliez cela et que vous enregistrez cela, disons, le bundle Javascript sera construit ici,
comme vous le voyez, j'ai lancé cela sur Android et iOS et maintenant nous obtenons cet écran d'erreur rouge
dont je parlais et encore
ici, nous pouvons simplement lire le message d'erreur.
Il nous indique toujours la mauvaise solution, en attendant une virgule, mais il nous pointe vers la bonne ligne de
code,
ici vous voyez qu'il met en évidence ce titre de bouton ajouter une nouvelle ligne de but, donc il nous montre toujours où
nous devons regarder et que le problème est provenant probablement de cette ligne.
Nous obtenons la même erreur en passant ici dans cette console et également dans nos outils de développement expo ici, là vous voyez le
même message d'erreur avec un indice sur la ligne d'où cette erreur provient, donc vous obtenez
beaucoup de aide pour localiser ce problème. Maintenant ici, malheureusement, je ne comprends toujours pas
que j'ai corrigé cette erreur et donc ici, nous le voyons se bloquer, sur iOS sur
Android, ce n'est pas
le rechargement. Maintenant, sur Android,
nous voyons une commande que nous pouvons utiliser pour
recharger l'application, nous pouvons cliquer là-bas ou appuyer deux fois sur r pour recharger mais il ne reprend toujours pas la modification ici même
si j'ai corrigé cela dans le
code, donc une solution ici est de arrêtez simplement le package ou redémarrez npm start.
Cela se produit rarement mais parfois cela se casse, puis redémarrer simplement ce processus de démarrage npm est la
chose à faire et
avec cela, je le relancerai sur Android en appuyant sur a et sur iOS en appuyant sur i et maintenant
cela devrait relancer l'application sur ces appareils .
Encore une fois, cela se produira rarement mais parfois cela se produit simplement et vous pouvez simplement le
redémarrer pour que cela fonctionne correctement.
Maintenant que cela fonctionne à nouveau, permettez-moi de vous montrer un exemple de message d'erreur que vous obtenez là où vous n'avez
pas d'erreur de syntaxe mais vous avez toujours un bug clair dans votre code.
Disons que lorsque nous ajoutons un objectif ici avec le titre de l'objectif, nous ajoutons une vérification où nous voyons si la longueur du titre de l'objectif est supérieure
à zéro pour vérifier que la valeur n'est pas vide ou effectivement qu'elle est égale à zéro, ce qui signifie que l'utilisateur n'a pas
'' t entrez un titre et dans ce
cas, nous revenons juste ce qui signifie que nous n'allons pas ajouter cet objectif ici et nous n'allons pas non plus
fermer le modal,
donc nous ignorons simplement l'entrée utilisateur car elle est vide.
Nous pourrions vouloir afficher
un message d'erreur, mais pour l'instant, nous allons le faire comme ceci.
Maintenant, lorsque nous faisons
cela,
cela fonctionnera généralement bien ici, non? Si je l'enregistre et que nous revenons ici, l'ouvrons et je clique sur ajouter, vous voyez que je
ne peux pas ajouter un objectif vide, je dois saisir quelque chose pour que cela disparaisse.
Maintenant, disons dans notre composant d'entrée d'objectif où nous récupérons l'entrée utilisateur, où nous la transmettons
ensuite en appelant ajouter objectif ici, nous oublions de le faire, nous transmettons null ici ou nous ne transmettons rien parce que
nous avons simplement oublié d'ajouter ceci ici. Maintenant, notre application démarre très bien, elle ne se casse
pas immédiatement car nous n'avons pas d'erreur claire dans notre code, pas d'erreur de syntaxe mais si j'entre quelque chose ici et que je clique sur ajouter, je ne
suis pas défini n'est pas un objet, évaluant la longueur du titre de
l'objectif et encore une fois, c'est un message d'erreur qui nous aide.
Cela nous informe que le problème a quelque chose à voir avec quelque chose qui n'est pas défini et qu'il est lié à
cette vérification de la longueur du titre de l'objectif,
puis vous pouvez plonger à l'endroit où vous accédez à la longueur du titre de l'objectif et retracer le problème.
Nous avons donc des problèmes pour obtenir la longueur du titre de but car il n'est pas défini comme il semble. Nous l'obtenons ici, donc l'erreur n'est certainement
pas
là, mais allons à l'endroit où le gestionnaire d'ajout de buts est appelé à
la fin.
Maintenant, si vous vous en souvenez, nous transmettons ceci à l'accessoire de but sur add here sur l'entrée d'objectif, nous
devrions donc probablement aller à l'entrée d'objectif que vous pouvez également faire en maintenant la commande ou le contrôle
et en cliquant sur le nom du composant. Eh bien là-dedans, nous appelons à ajouter un objectif ici et oh, ici nous voyons quelle est l'erreur. Maintenant, bien sûr, dans ce cas, j'ai construit
cette erreur ici, mais vous comprenez mon point de vue, c'est une erreur
que vous pourriez certainement avoir dans votre code où vous avez oublié de l'ajouter, où vous pouvez peut-être changer
la façon dont votre code fonctionne et vous avez oublié d'ajuster dans tous les endroits et donc, vous
obtenez soudainement cette erreur.
Maintenant, le message d'erreur nous a aidés à trouver le problème.