如何将Vue中表格数据，以Excel格式导出？报saveAs错误如何解决？

一、安装依赖

npm install file-saver --save

npm install xlsx --save

npm install script-loader --save-dev

二、下载两个所需的js文件Blob.js和Export2Excel.js

链接： https://pan.baidu.com/s/1CNcEncW-fjFDyinEo5J2Qw

提取码：5qwz

三、在src目录下新建vendor文件夹、将Blob.js和Export2Excel.js两个文件放进去

四、Vue部分(UI用的ElmentUI)

HTML:

<el-button type="primary" size="medium" @click="export2Excel">导出</el-button>

<el-table-column type="selection" width="35" v-model="multipleSelection">
</el-table-column>

data()：

data() {return {multipleSelection: [],}
},

methods：

//导出表格
formatJson(filterVal, jsonData) {return jsonData.map(v => filterVal.map(j => v[j]))
},
export2Excel() {if (this.multipleSelection.length) {import('@/vendor/Export2Excel').then(excel => {const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']const filterVal = ['id', 'name', 'number', 'shopId', 'desc']const list = this.multipleSelectionconst data = this.formatJson(filterVal, list)excel.export_json_to_excel(tHeader, data, 'table')})} else {this.$message({message: '请至少勾选一项，再进行操作',type: 'warning'});}
}

注：如果出现saveAs错误，多半是依赖包file-saver的版本有错，换一个版本，npm i file-saver@1.3.3 ，再试试看是否已经好了呢？！

如何将Vue中表格数据，以Excel格式导出？报saveAs错误如何解决？相关推荐

C#读取Excel表格数据到DataGridView中和导出DataGridView中的数据到Excel
其实想在datagridview中显示excel表格中的数据跟读取数据库中的数据没什么差别,只不过是创建数据库连接的时候连接字段稍有差别. private void btnShow_Click(obj ...
vb用数组方式快速导出MSFlexGrid表格数据到Excel表格中
本来从MSFlexGrid或MSHFlexGrid导出数据到Excel中,是一个非常简单的问题,但论坛里还是经常有人问如何导出,有的虽然知道用单元格赋值方式循环导出,但速度太慢,因此写了一个通用的数据 ...
在vue中把数据导出Excel文件
在vue中把数据导出Excel文件第一次尝试写文章在vue中把数据导出成Excel格式的文件,话不多,上代码: 第一步我们要先安装几个集成的插件 npm install -S file-saver ...
vue校验表格数据_如何通过数据验证限制Google表格中的数据
vue校验表格数据 If you use Google Sheets to collaborate with others, you can prevent people from typing th ...
标题vue导出表格数据，excel表格打不开
vue导出表格数据,excel表格打不开代码如下,当时是将**responseType: 'blob'**写在{headers: getHeader() }外面,导致问题一直没解决,后来经过度娘,了 ...
python excel模板生成excel表格_python制作简单excel统计报表3之将mysql数据库中的数据导入excel模板并生成统计图...
python制作简单excel统计报表3之将mysql数据库中的数据导入excel模板并生成统计图 #coding=utf-8 from openpyxl importload_workbookfro ...
python pdf 数据转excel 表格_python实现PDF中表格转化为Excel的方法
这几天想统计一下<中国人文社会科学期刊 AMI 综合评价报告(2018 年):A 刊评价报告>中的期刊,但是只找到了该报告的PDF版,对于表格的编辑不太方便,于是想到用Python将表格转 ...
linux qt写入excel文件内容,Qt 读取Excel表格数据生成Excel表格并写入数据
Qt 读取Excel表格数据生成Excel表格并写入数据 Qt 读取Excel表格数据生成Excel表格并写入数据修改.pro文件,增加 axcontainer QT += axcontaine ...
从浏览器下载表格数据为Excel的两种实现方法
一.使用说明实际开发运用过程中,往往需要将页面上的一些表格数据生成Excel供用户下载使用,根据不同的需求,此处整理了两种方式:(两种方式浏览器都可直接提示下载或保存文件) 方式一: 1.需求: 生 ...
java将jsp页面表格导出excel表格数据_简单的POI导出JSP页面表格数据到excel
数据库中的equipment表数据: 读取数据库中表数据的代码TestExcel.java public class TestExcel extends BaseAction{/** * @param ...

如何将Vue中表格数据，以Excel格式导出？报saveAs错误如何解决？

如何将Vue中表格数据，以Excel格式导出？报saveAs错误如何解决？相关推荐

最新文章

热门文章