Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

272
Vistas
Vue: recargar datos después de que comience la descarga de href

Estoy haciendo una simple llamada a window.location.href para iniciar la descarga de un archivo. Después de eso, llamo a un método para recargar una tabla.

 window.location.href = url; this.getFileListing();

Pero la recarga es demasiado rápida, porque href crea un registro en la base de datos.

Agregar un tiempo de espera de 1 segundo lo soluciona:

 window.location.href = url; setTimeout(() => { this.getFileListing(); }, 1000);

... pero eso es descuidado. ¿Cómo espero a que comience la descarga (por lo tanto, existirá el registro de la base de datos) antes de llamar a la recarga?

*Nota: la ubicación de la ventana no cambia. Solo estoy usando windows.location.href para llamar a una ruta local, que comienza a descargar un archivo. Por lo tanto, no creo que popstate o hashchange funcionen.

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

en lugar de iniciar la descarga con window.location.href para vue, puede usar axios para descargar un archivo y usar then método con la promesa de iniciar el método necesario

 axios({ url: url, method: 'GET', responseType: 'blob' .then(response => (this.getFileListing()))

Si está utilizando jQuery, puede probar algo equivalente con jquery get https://api.jquery.com/jquery.get/

 var instance = this; $.get("fileToDownload", function() { //code when download is launch }).done(function() { instance.getFileListing(); })
about 4 years ago · Juan Pablo Isaza Denunciar

0

Mi solución: usar axios y MUCHO código para obtener la respuesta y pasarla al navegador. Tuve que analizar el nombre de archivo original. No estoy seguro si valió la pena. De hecho, puse las funciones en un mixin para poder agregarlas fácilmente a otros componentes.

 downloadToBrowser(url, successCallback) { axios({ method: 'GET', url: url, responseType: 'blob' }) .then(response => { this.startDownload(response); successCallback(); }); }, startDownload(response) { var filename = response.headers['content-disposition'].split('=')[1]; const url = window.URL.createObjectURL(new Blob([response.data])); const link = document.createElement('a'); link.href = url; link.setAttribute('download', filename); document.body.appendChild(link); link.click(); },

Luego llame al método, pasando la URL y la devolución de llamada:

 this.downloadToBrowser(url, this.getFileListing);

*Si tiene algún comentario sobre algo que podría hacer mejor/diferente, agradezco sus comentarios.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda