Cómo hacer que axios sea sincrónico

Luego de investigar en diferentes repositorios y foros de internet al terminar hemos descubierto la respuesta que te mostraremos aquí.

Solución:

No puede (o al menos no debería) hacerlo sincrónico, por lo que necesitará una forma diferente de avanzar.

Una idea: devolver la promesa de Axios:

checkUniqueness () 
    return axios.get('/api/persons/unique/alias', 
        params: 
            id: this.id,
            alias: this.alias,
        
    )
    .then((response) => 
        console.log('2. server response:' + response.data.unique)
        this.valid = response.data.unique;
    );

y luego llamar then() en eso en save():

this.checkUniqueness()
.then((returnVal) => 
   // other validations here
  //  save
)
.catch(err => console.log("Axios err: ", err))

Incluso podría hacer todas sus comprobaciones en un solo lugar si devolviera el valor de Axios’s then() en lugar de establecer la bandera:

.then((response) => 
    console.log('2. server response:' + response.data.unique)
    return response.data.unique;
 );

luego en guardar:

this.checkUniqueness()
.then((valid) => 
    if (valid) // do something
   // other validations here
   //  save
)

Si solo hace lo que muestran los documentos JS (mozilla), puede tratar a Axios como una promesa más. Tenga cuidado al hacer que la solicitud sea síncrona porque puede congelar la interfaz de usuario y el resto de su aplicación.

       async save () 
            this.valid = true;
            console.log('before checking');

            const isUnique = await this.checkUniqueness();
            console.log(isUnique); // => value waited for and returned from this.checkUniqueness()
            // other validations here

            if (this.valid) 
                console.log('3. checked valid, can save now');
                // save now
            
        

axios.get(...) devuelve un promesa (una tarea que se promete para más adelante) y puedes esperar al intérprete hasta que esta promesa termine con un await palabra en ES6+:

let response = await axios.get(...)

pero axios.get(...) devuelve la respuesta mientras axios.get(...).then(...) devuelve lo que pretendías devolver. así que si no devuelves nada en then part será undefined:

let response = await axios.get(...).then() // nothing returns in then
console.log(response) // undefined

---

---

Utiliza Nuestro Buscador