vue导出excel表格弹出保存路径
时间: 2023-07-27 15:27:19 浏览: 269
您可以使用FileSaver.js库将数据导出为excel文件,并使用HTML5的download属性将文件下载到本地。以下是一个简单的示例代码:
```javascript
// 导出数据为excel文件
var exportData = function () {
// 数据
var data = [
['姓名', '性别', '年龄'],
['张三', '男', '18'],
['李四', '女', '20'],
['王五', '男', '22']
];
// 创建excel文件对象
var wb = XLSX.utils.book_new();
var ws = XLSX.utils.aoa_to_sheet(data);
XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
// 保存excel文件
var wbout = XLSX.write(wb, { bookType: 'xlsx', type: 'binary' });
saveAs(new Blob([s2ab(wbout)], { type: 'application/octet-stream' }), 'export.xlsx');
}
// 将字符串转为ArrayBuffer
var s2ab = function (s) {
var buf = new ArrayBuffer(s.length);
var view = new Uint8Array(buf);
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
// 点击按钮导出数据
document.getElementById('btn-export').addEventListener('click', exportData);
```
在这个例子中,我们使用了XLSX.js库来创建excel文件对象,并使用FileSaver.js库将文件保存到本地。在导出excel文件时,我们需要将数据转换为二进制格式,并使用Blob对象创建一个文件。我们还使用download属性指定文件名,这将提示用户将文件保存在本地。
阅读全文