el-table表格数据导出csv

你可以使用以下步骤来将 el-table 表格数据导出为 CSV 文件：

1. 在你的 Vue 组件中引入 `json2csv` 库和 `file-saver` 库：

import json2csv from 'json2csv';
import { saveAs } from 'file-saver';

2. 创建一个方法用于将表格数据转换为 CSV 格式：

exportTableToCSV() {
  // 获取表格的表头
  const header = this.columns.map(col => col.label);
  // 获取表格的数据
  const data = this.data.map(row => this.columns.map(col => row[col.property]));

  // 将表头和数据合并为一个数组
  const csvData = [header, ...data];

  // 将数组转换为 CSV 格式的字符串
  const csvString = json2csv.parse(csvData);

  // 将字符串转换为 Blob 对象，用于下载
  const blob = new Blob([csvString], { type: 'text/csv;charset=utf-8' });

  // 使用 file-saver 库下载 CSV 文件
  saveAs(blob, 'table.csv');
}

3. 在你的表格组件中添加一个导出按钮，并绑定 `exportTableToCSV` 方法：

<template>
  <div>
    <el-button type="primary" @click="exportTableToCSV">导出 CSV</el-button>
    <el-table :data="data" :columns="columns"></el-table>
  </div>
</template>

现在，当用户点击导出按钮时，表格数据将会被转换为 CSV 格式并自动下载到用户的计算机中。