在vue中导出csv文件
2023-12-13 04:25:44
    		在Vue中使用 xlsx 库将表格数据导出为CSV文件,你需要按照以下步骤操作:
安装 xlsx 库
如果你的项目中还没有安装xlsx库,可以使用npm或yarn来安装它。
npm install xlsx
# 或者
yarn add xlsx
在Vue组件中导入xlsx库:
 在需要处理CSV文件的组件中,导入xlsx库。
import * as XLSX from 'xlsx';
将数组导出成CSV
<template>
  <button @click="exportToCsv">导出 CSV</button>
</template>
<script>
import * as XLSX from 'xlsx';
export default {
  data() {
    return {
      tableData: [
        { id: 1, name: 'Alice', age: 24 },
        { id: 2, name: 'Bob', age: 22 },
      ]
    };
  },
  methods: {
    exportToCsv() {
      // 将数据转换为工作表
      const ws = XLSX.utils.json_to_sheet(this.tableData);
      // 创建新的工作簿并添加工作表
      const wb = XLSX.utils.book_new();
      XLSX.utils.book_append_sheet(wb, ws, "Sheet1");
      // 导出工作簿
      XLSX.writeFile(wb, 'tableData.csv');
    }
  }
};
</script>
    			文章来源:https://blog.csdn.net/qq_45503196/article/details/134800398
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
    	本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!