vue2导出excel

要在Vue2中导出Excel，可以使用以下步骤：

1. 首先，安装`xlsx`和`file-saver`库：

npm install xlsx file-saver --save

2. 创建一个`exportExcel`方法，该方法将接收一个数据数组和一个文件名。在该方法中，我们将使用`xlsx`库将数据转换为Excel文件，并使用`file-saver`库将其保存到本地文件系统中。

import XLSX from 'xlsx'
import { saveAs } from 'file-saver'

export default {
  methods: {
    exportExcel(data, fileName) {
      const worksheet = XLSX.utils.json_to_sheet(data)
      const workbook = XLSX.utils.book_new()
      XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1')
      const buffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
      const blob = new Blob([buffer], { type: 'application/octet-stream' })
      saveAs(blob, `${fileName}.xlsx`)
    }
  }
}

3. 在组件中调用`exportExcel`方法，并传递要导出的数据和文件名。例如：

export default {
  data() {
    return {
      users: [
        { name: 'John', email: 'john@example.com', age: 25 },
        { name: 'Jane', email: 'jane@example.com', age: 30 },
        { name: 'Bob', email: 'bob@example.com', age: 35 }
      ]
    }
  },
  methods: {
    handleExport() {
      this.exportExcel(this.users, 'users')
    }
  }
}

4. 添加一个按钮或其他触发器，以便在单击时调用`handleExport`方法。

<template>
  <div>
    <button @click="handleExport">Export Excel</button>
  </div>
</template>

这样，当用户单击“Export Excel”按钮时，将生成一个名为“users.xlsx”的Excel文件，并将其保存到本地文件系统中。