在VueJs中以CSV，Excel，PDF格式导出表格数据

Question

我正在研究 vueJs 模板，我需要以三种格式导出表数据，即 .pdf、.csv、.xls 我尝试过这个问题，但它的 show Utils 未定义。那么我怎样才能实现我想要的

Answer 1

简单的方法

如果您可以使用不同的表组件，请尝试查看Vue 物化数据表

它允许您以 XLS 格式导出并打印为 PDF

没有任何组件

我个人使用的方式如果我需要导出包含比实际表中更多字段的任何 JSON：

https://www.papaparse.com/

import Papa from "papaparse";

var blob = new Blob([Papa.unparse(jsonData)], { type: 'text/csv;charset=utf-8;' });

var link = document.createElement("a");

var url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", 'filename.csv');
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);

因此，我们实际上将 JSON 数据解析为 blob，创建链接到它的动态元素并下载文件。