Es inevitable que necesite exportar la función de informe cuando se trata del sistema de gestión en segundo plano. Aunque hay decenas de millones de recursos en línea, mi método es compatible con el cliente (el método anterior al pro-test tiene errores en el cliente), y después de la optimización continua, el cliente también ha obtenido buenos resultados. Mi requisito aquí es: haga clic en exportar para llamar a la API de back-end, devolver la URL del archivo descargado y el front-end crea el iframe descargado de acuerdo con la dirección de la URL. Consulte a continuación para su uso:
comm.js
export default {
// Vue.js的插件应当有一个公开方法 install。这个方法的第一个参数是 Vue 构造器，第二个参数是一个可选的选项对象。
install: function(Vue) {
//创建个全局的$derive方法
Vue.prototype.$derive = function (url) {
let div = document.createElement("div");
div.style.display = 'none';
//生成隐藏的iframe标签
div.innerHTML = '<iframe id="idFrame" name="idFrame" src="' + url + '" height = "0" width = "0" frameborder="0" scrolling="auto" style = "display:none;visibility:hidden" ></iframe>';
document.body.appendChild(div)
setTimeout(function () {
document.body.removeChild(div)
}, 30000)
}
}
utilizar
handleExportPort() {
this.$api.commonExport(this.paramsObj).then(res => {
if (res.data.appCode == '0000') {
//res.dataa.data就是后端返回的地址
this.$derive(res.data.data)
} else {
this.$Message('error', '导出失败！')
}
})
}