[SOLUCIONADO] Axios: valor correcto del contador dentro del then pero no afuera

[7sistemas]

Buenas!
Tengo una función que hace una llamada a axios.get. Dentro del .then, hay un contador que se debe incrementar. Ahí adentro, el valor es correcto, pero cuando consulto el valor del contador fuera de esa función, no está actualizado a pesar de haberse cumplido la solicitud, y no entiendo por qué.

He leído y consultado un montón pero nadie me puede responder por qué.

No quiero cambiar el código otra vez, dado que si la consulta fue respondida y la variable es global, aunque sea una solicitud asíncrona, debería estar actualizada.

Código:

var errores_personal_cnt = 0;
function validar(dato_a_validar, url, secc, control)
{
        var datastr = url + '?secc=' + secc + '&dato=' + dato_a_validar;
        axios.get(datastr)
        .then(response => {
                var estado = response.data;
                "Respuesta: " + console.log(estado);
                if (estado != 1)
                {
                        control.style.borderColor = "red";
                        control.style.backgroundColor = "red";
                        control.title = estado;
                        errores_personal_cnt++;
                        errores_personal += "\t- " + estado + "\n";
                        return false;
                }
                else
                {
                        control.style.borderColor = "lightgreen";
                        control.style.backgroundColor = "lightgreen";
                        control.title = "Correcto";
                        return true;
                }
        })
        .catch(response => {
                "Respuesta: " + console.log(response.data);
                console.log("Estado: error -> " + response.data);

                control.style.backgroundColor = error_app;
                control.style.borderColor = error_app;
                control.title = "Ha ocurrido un error con la aplicación. Intentalo nuevamente en unos segundos.";
                        errores_personal_cnt++;
                errores_personal += "\t- ha ocurrido un error en la validación\n";
                return false;
        });

}

[prueba230683]

si la consulta fue respondida y la variable es global, aunque sea una solicitud asíncrona, debería estar actualizada.

El problema es que no se puede saber de antemano cuándo será actualizada dicha variable global (errores_personal_cnt), porque como bien indicas, la petición es asíncrona.

No tenemos más información de tu código, pero quizá es algo que se pueda replantear de otra forma. Aunque siempre puedes hacer que la función validar devuelva una promesa:

Código:

var errores_personal_cnt = 0;
function validar(dato_a_validar, url, secc, control)
{
        var datastr = url + '?secc=' + secc + '&dato=' + dato_a_validar;
        return axios.get(datastr)
        .then(response => {
                var estado = response.data;
                "Respuesta: " + console.log(estado);
                if (estado != 1)
                {
                        control.style.borderColor = "red";
                        control.style.backgroundColor = "red";
                        control.title = estado;
                        errores_personal_cnt++;
                        errores_personal += "\t- " + estado + "\n";
                        return false;
                }
                else
                {
                        control.style.borderColor = "lightgreen";
                        control.style.backgroundColor = "lightgreen";
                        control.title = "Correcto";
                        return true;
                }
        })
        .catch(response => {
                "Respuesta: " + console.log(response.data);
                console.log("Estado: error -> " + response.data);

                control.style.backgroundColor = error_app;
                control.style.borderColor = error_app;
                control.title = "Ha ocurrido un error con la aplicación. Intentalo nuevamente en unos segundos.";
                        errores_personal_cnt++;
                errores_personal += "\t- ha ocurrido un error en la validación\n";
                return false;
        });

}

Y meter el resto de tu código en una función anónima de este tipo:

Código Javascript:

(async () => {
  // ...
  var valor = await validar(dato_a_validar, url, secc, control); // esperamos a que la promesa se resuelva
  console.log(valor); // true o false
  console.log(errores_personal_cnt); // la variable actualizada
})();
 

[Panino5001]

También puede crear una función que muestre el valor de errores_personal_cnt (que se ocupe de mostrar en el html el valor de esa variable) e invocarla al principio, para mostrar el valor en cero, e invocarla también cada vez que se resuelva la promesa (dentro del then y el catch).