Para esto estoy de vuelta en esta aplicación en la que trabajamos, esta aplicación de objetivos donde podemos
agregar algunos objetivos aquí y este es el código que escribimos allí, no he cambiado nada allí.
Ahora déjame mostrarte las diferentes cosas que podrían salir mal y cómo las arreglas.
Entonces, comencemos simple, digamos
que tenemos un error de sintaxis simple, aquí donde abrimos nuestro modal al final estableciendo el modo de
agregar en
verdadero, permítanme eliminar ese corchete de cierre. Ahora que es un claro error de sintaxis, es un
error que podemos y debemos evitar por completo porque nosotros, como desarrolladores, cometimos un claro error.
Ahora, lo bueno es que incluso nuestro IDE reconoce esto y nos da una advertencia aquí, aunque desafortunadamente, el error
que muestra aquí no es del todo correcto,
dice que está esperando una coma, bueno, en realidad
ese no es el problema real, el problema real es un Falta el soporte.
Aún así, tenemos una idea de que algo está
mal aquí y, si bien aún debe pensar en el problema y no puede usar esa solución a ciegas
mirando ese código, en algún momento debería descubrir que falta un soporte.
Incluso si olvida esto y guarda esto, digamos, entonces el paquete Javascript se construirá aquí, como puede ver,
lancé esto tanto en Android como en iOS y ahora estamos recibiendo esta pantalla de error roja de la
que estaba hablando y nuevamente
aquí, simplemente podemos leer el mensaje de error.
Todavía nos está apuntando a la solución incorrecta, esperando una coma, pero nos señala la línea de código correcta,
aquí
puede ver que resalta el título de este botón, agregue una nueva línea de meta, por lo que aún nos muestra dónde
debemos mirar y que el problema es probablemente derivado de esta línea.
Por cierto, obtenemos el mismo error aquí en esta consola y también en nuestras herramientas de desarrollo de exposición, aquí puede ver el mismo mensaje de
error también con una pista en la línea de donde proviene este error, por lo que está
obteniendo un montón de Ayuda para localizar este problema. Ahora aquí, desafortunadamente todavía no se da cuenta
de que solucioné este error y, por lo tanto, aquí, vemos que se bloqueó, en iOS
en Android, no se
está recargando. Ahora en Android,
vemos un comando que podemos usar para volver a
cargar la aplicación, podemos hacer clic allí o presionar r dos veces para volver a cargarlo, pero aún no está recogiendo el cambio aquí a
pesar de que lo arreglé en el
código, así que una solución aquí es simplemente detenga el paquete o reinicie npm start.
Esto ocurre raramente, pero a veces esto se rompe y luego simplemente reiniciar este proceso de inicio de npm
es lo que hay
que hacer y con eso, lo volveré a ejecutar en Android presionando ay iOS presionando i y ahora esto
debería reiniciar la aplicación en estos dispositivos .
Nuevamente, esto sucederá raramente, pero a veces simplemente sucede y puede reiniciarlo para que
vuelva a funcionar correctamente.
Ahora, con eso ejecutándose nuevamente, permítame mostrarle un ejemplo de un mensaje de error que está recibiendo donde no tiene
un error de sintaxis pero aún tiene un error claro en su código.
Digamos que cuando agregamos un objetivo aquí con el título del objetivo, agregamos un control donde vemos si la longitud del título del objetivo es mayor que
cero para verificar que el valor no esté vacío o que en realidad sea igual a cero, lo que significa que el
usuario no t ingrese un título y
en este caso, solo regresamos, lo que significa que no agregaremos este objetivo aquí y tampoco cerraremos el modal,
por lo que
solo ignoramos la entrada del usuario porque está vacía.
Es posible que queramos
mostrar un mensaje de error, pero por ahora lo haremos así.
Ahora, cuando hacemos
eso,
generalmente funcionará bien aquí, ¿verdad? Si guardo esto y volvemos aquí, lo abro y hago clic en Agregar, verá que no
puedo agregar un objetivo vacío, tengo que ingresar algo para que esto desaparezca.
Ahora digamos en nuestro componente de entrada de objetivos donde estamos obteniendo la entrada del
usuario, donde luego lo reenviamos llamando a agregar objetivo aquí, nos olvidamos de hacer eso, reenviamos nulo aquí o no reenviamos
nada porque simplemente olvidamos agregar esto aquí. Ahora nuestra aplicación comienza bien, no se rompe de
inmediato porque no tenemos un error claro en nuestro código, no hay error de sintaxis, pero si ingreso algo aquí y hago clic en Agregar, obtengo indefinido
no es un objeto, evaluando la longitud del título del objetivo y
De nuevo, este es un mensaje de error que nos ayuda.
Nos informa que el problema tiene algo que ver con algo que no está definido y que está relacionado con esta verificación
de la longitud del título del objetivo y
luego podría sumergirse en el lugar donde accede a la longitud del título del objetivo y rastrear el problema.
Así que estamos teniendo problemas para obtener la longitud del título del gol porque parece indefinido. Lo estamos obteniendo aquí, por lo que el
error
ciertamente no está aquí, pero vayamos al lugar donde al final se llama agregar controlador
de objetivos.
Ahora, si recuerdas, estamos pasando esto al accesorio de agregar objetivo aquí en la entrada de objetivo, por lo que
probablemente deberíamos ir a la entrada de objetivo, que por cierto también puedes hacer manteniendo presionado comando o control
y haciendo clic en el nombre del componente. Bien allí, invocamos agregar objetivo aquí y, oh, aquí vemos cuál es el error. Ahora, por supuesto, en este caso, construí
este error aquí, pero obviamente entiendo mi punto, este es un error
que ciertamente podría tener en su código donde olvidó agregarlo, donde tal vez cambie la forma en
que funciona su código y olvidó ajustar en todos los lugares y, por lo tanto, de
repente obtienes este error.
Ahora el mensaje de error nos ayudó a encontrar el problema.