如何在 vue.js 中创建 CSV 文件

Question

我尝试在 vue.js 中创建 CSV 文件。服务器发送就绪数据，我们可以直接将数据写入 csv 文件。来自服务器响应的数据是

head1, head2, head3, head4
1,2,3,4
5,6,7,8

这是我来自服务器的响应格式。我想以 CSV 格式写入这些数据并提供下载 CSV 功能。

关于在 vue.js 中创建和编写文件有什么想法吗？

Answer 1

我通过使用 javascript 得到了答案。

我创建了一个隐藏的 html <a> 标签

<a href="" id="downloadlink" ref="csvfiledownload" hidden="true" download="mycsv.csv">download</a>

Bellow 是我用于下载 csv 的 javascript 函数

downloadCSV(data){
    var link = document.getElementById('downloadlink');
    link.href = Utils.makeTextFile(response.data);
    link.style.display = 'block';
    link.click();
}

数据值是CSV格式数据

col1, col2, col3
row1-value1, row1-value2, row1-value3

这里是我的 makeTextFile 函数。

function makeTextFile {
    var encodedUri = encodeURI(csvContent);
    var link = document.createElement("a");
    link.setAttribute("href", encodedUri);
    link.setAttribute("download", "mycsv.csv");
    document.body.appendChild(link);
    return link;

}