首页 > 其他 > 详细

VUE 导出Excel(iframe)

时间:2019-02-13 16:42:37      阅读:304      评论:0      收藏:0      [点我收藏+]

1. 概述

1.1 说明

在开发过程中,有时候需要导出某数据表格(excel)以便客户使用,使用iframe对返回二进制文件进行下载处理。记录此功能,以便后期使用。

 2. 示例

 2.1 vue示例代码

<template>
  <div>
    <button class="btnClass" @click="downExcel">下载</button>
    <iframe frameborder="0" name="downExcel" style="display:none"></iframe>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
  methods: {
    downExcel() {
      let iframe = window.frames[‘downExcel‘];
      //console.log(‘iframe‘,iframe.location.href);
      let href = ‘‘;//接口路径地址,返回数据类型为application/binary,后台控制显示信息,前端仅为下载功能
      iframe.location.href = href
    }
  }
}
</script>
<style scoped>
.btnClass{
  width: 200px;
  background-color: cornflowerblue;
  height: 60px;
  border: none;
  color: #ffffff;
  font-size:30px;
  cursor:pointer
}
</style>

 

VUE 导出Excel(iframe)

原文:https://www.cnblogs.com/ajuan/p/10369910.html

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