vue 使用Blob实现下载xls文件

  • Z时代
  • 2024-01-10
  • 分类：综合

vue

1 页面代码

<el-button size="mini" id='testBtn2' @click="test"><i class=" fa fa-search " aria-hidden="true"></i>下载

<a id='testBtn' >下载测试</a>

</el-button>

2 js代码

//测试
test(){
    var box=document.getElementById("test").outerHTML;
    var total=document.getElementById("test").outerHTML
    var html = "<html><head><meta charset='utf-8' /></head><style>table{border:1px;}</style><body> <div align='center'><caption>测试</caption></div>" +box+total + "</body></html>";
    var reg1 = new RegExp('border="0" ' ,'g' );//正则替换
    var html2=html.replace(reg1,'border="1" ');//全局替换replace不是全局替换，仅仅是单个替换
    var blob = new Blob([html2], { type: "application/vnd.ms-excel" }); 
    document.getElementById('testBtn').download="1.xls"
    document.getElementById('testBtn').href= URL.createObjectURL(blob);
    alert("over")
},

3 示例

以上是 vue 使用Blob实现下载xls文件 的全部内容， 来源链接： utcz.com/z/376683.html

回到顶部