Utilizar axios de forma asíncrona en React Native

Tiempo de lectura: < 1 minuto

En este artículo os voy a enseñar cómo utilizar axios de forma asíncrona en vuestros proyectos.

Partiendo del siguiente código para realizar una llamada GET con axios:

       axios.get("tu_url")
            .then(resp=> {
               alert(resp.data)
            }).catch(error =>
               alert(error)
            );

Al utilizar la sentencia .then la APP se queda a la espera de cargar el resultado de forma síncrona.

Para cambiar la llamada a una llamada asíncrona hay que hacer la siguiente modificación:

          try {
            const resp = await axios.get("tu_url")
            alert(resp.data)
        } catch (err) {
            console.log(err)
        }

1. Creamos un try/catch para ser capaces de recuperar los errores que puedan surgir al realizar la llamada.
2. Creamos una constante (const) dónde se va a almacenar la respuesta de nuestro GET.
3. Para ejecutar la llamada añadimos await delante de la función de axios.
4. El sistema ejecutará en segundo plano la llamada await y devolverá la respuesta a la constante creada. Para ver el resultado añadimos un alert de ejemplo resp.data contendrá los datos del servidor REST.