导出excel表格

争取吃肉

于 2022-05-20 00:00:20 发布

阅读量155

点赞数

文章标签： elementui javascript vue.js

本文链接：https://blog.youkuaiyun.com/weixin_58610381/article/details/124874562

版权

这篇博客展示了如何在Vue.js应用中使用Export2Excel.js库来导出数据到Excel文件。通过点击按钮触发`exportExcel`函数，该函数首先定义了Excel的列头，然后调用`export_json_to_excel`方法，将格式化后的数据转换为Excel并下载。代码中还包含了一个简单的数据列表示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<template>
  <div>
    <button @click="exportExcel">导出</button>
  </div>
</template>

<script setup>
  const list = [
    {name:'zs', age:123},
    {name:'ls', age:99, sex:'1'},
    {name:'ls222', sex:'1'},
  ]
  // 导出
  const exportExcel = () => {
    const headers = {
      '姓名': 'name',
      '年龄': 'age'
    }
    import ('@/vendor/Export2Excel').then(async excel => {
      excel.export_json_to_excel({
        header: Object.keys(headers),
        data: formatJson(headers,list ),
        filename:'员工表'
      })
    })
  }
  const formatJson = (headers,rows) =>{
    return rows.map(item=>{
      return Object.keys(headers).map(k => {
        return item[headers[k]]
      })
    })
  }
</script>

下载 Export2Excel.js 文件

import { saveAs } from 'file-saver'

import * as XLSX from 'xlsx'