首页 > 数据库技术 > 详细

vue中前端实现下载excel文件,.csv文件, .sql文件

时间:2020-07-29 10:39:39      阅读:496      评论:0      收藏:0      [点我收藏+]

主要是使用了js的new Blob方法

//如果需要适应IE的话加上这个方法

MyBrowserIsIE() {

  let isIE = false;

  if(navigator.userAgent.indexOf(‘compatible‘) > -1 && navigator.userAgent.indexOf(‘MSIE‘) > -1) {

    isIE = true

  } if (navigator.userAgent.indexOf(‘Trident‘) > -1) {

    isIE = true;

  }

  return isIE 

}

 

//excel文件下载
toExcell(index, row) {

  if(row.oStyle == 1){
    this.$axios({
      method: "post",
      data: {},
      responseType: "blob"
    })
    .then(res => {
      const link = document.createElement("a");
      let blob = new Blob([res.data], { type: "application/vnd.ms-excel" });
      link.style.display = "none";
      link.href = URL.createObjectURL(blob);
      let num = "";
      for (let i = 0; i < 10; i++) {
        num += Math.ceil(Math.random() * 10);
      }
      link.setAttribute("download", "用户_" + num + ".xls");
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    })
    .catch(error => {
      this.$Notice.error({
        title: "错误",
        desc: "网络连接错误"
      });
    });
 }
}
 
//下载》sql文件
export(){
axios.get(‘/***‘, {
  params: {
   ids:1,
  datatype:‘DB2‘ } }) .then(function (data) { let blob = new Blob([‘\ufeff‘ + data],{
    type:‘application/text‘
  });
  let dateStr = new Date().toLocaleDateString().replace(/\//g,‘-‘);
  if (this.MyBrowserIsIE()) {
    navigator.msSaveBlob(blob,‘functions_‘ + dataStr + ‘.sql‘);
  } else {
    let url = URL.createObjectURL(blob);
    let a = document.createElement(‘a‘);
    a.style.display = ‘none‘;
    a.href = url;
    a.setAttribute(‘download‘, ‘functions_‘ + dataStr + ‘.sql‘);
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    window.URL.revokeObjectURL(url);
  }
  this.$message({
    type:‘success‘,
    message:‘导出成功!‘,
    duration:3000
  })

}) .catch(function (error) { 
  this.$message({
    type:‘error‘,
    message:‘导出失败,请检查网络!‘,
    duration:3000
  })
});
}
 
.csv文件下载只需要替换为这一段代码
 
let blob = new Blob(["\ufeff" + data],{
  type:‘text/csv‘
});
let dataStr = new Date().toLocaleDateString().replace(/\//g,‘-‘);
if(this.MyBrowserIsIE()){
  navigator.msSaveBlob(blob,‘abbrSpecInfo_‘ + dateStr + ‘.csv‘);
} else {
  let a = document.createElement(‘a‘);
  a.href = URL.createObjectURL(blob);
  a.target = ‘_blank‘;
  a.download = (‘abbrSpecInfo_‘ + dateStr + ‘.csv‘);
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}
 
}
    

vue中前端实现下载excel文件,.csv文件, .sql文件

原文:https://www.cnblogs.com/songxueqing/p/13392249.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!