vue项目导出xlsx文件

vue项目导出xlsx文件步骤

1. 设置一个按钮，绑定单击响应函数doExport()：

<a href="#" slot="extra" @click.prevent="doExport">
        <Icon type="forward"></Icon>导出  <!-- 这里使用了iview模板，不懂的可以直接使用button标签 -->
</a>

2. 导出函数模板如下：

doExport () {
    axios({
          method: 'get',
          // 这里输出表格内的所有数据，如果想导出指定数据，只需要修改中间的拼串就行了（再进行一次封装）
          url: window.location.origin + '/yyzt3-web/operation/pc/feedback/export.do?contact=' + this.formOptions.contact + '&context=' + this.formOptions.context,
          header: {
          token: localStorage.Token, // 有点类似于保存密码，可减少服务器的传输压力（具体知识点见帖子）
          'Content-Type': 'application/json,charset=utf-8' // 从服务器端请求的数据类型
          },
          //返回数据以二进制流形式保存
          responseType: 'arraybuffer' 
    }).then(res => {
          const blob = new Blob([res.data], { type: 'application/vnd.ms-excel,charset=utf-8'}); // File对象就是一种特殊的Blob，File 接口基于Blob
          const fileName = '意见反馈.xlsx'; // 文件名字
          // 注意，这是非IE下载
          const elink = document.createElement('a'); // 通过elink得到一个<a>标签（有点类似于ref）
          elink.download = fileName; // 规定被下载的超链接目标
          elink.style.display = 'none'; // 设置样式（照抄就行了）
          elink.href = URL.createObjectURL(blob); // 为<a>标签绑定href属性
          document.body.appendChild(elink); // 创建一个<a>标签
          elink.click();
          URL.revokeObjectURL(elink.href); // 释放URL对象
          document.body.removeChild(elink);
    });
},