vue导出csv文件（通过json2csv前端导出）

最新推荐文章于 2025-05-08 21:35:30 发布

迷茫的小猿

最新推荐文章于 2025-05-08 21:35:30 发布

阅读量2k

点赞数 2

分类专栏： vue csv 文章标签： vue csv

本文链接：https://blog.youkuaiyun.com/weixin_43747076/article/details/106373556

版权

这篇博客介绍了如何在Vue项目中实现CSV文件的导出。首先，讲解了安装必要的依赖，然后详细阐述了针对IE和非IE浏览器的两种不同下载实现方式，包括使用navigator.msSaveBlob方法和a标签的click事件。

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

第一步：安装依赖

npm install json2csv  -s

第二步：代码实现

下载方式：
IE浏览器不支持a标签进行下载，会打开url 故
对于微软系浏览器（IE和Edge）和非微软系列浏览器采用两种不同的方式进行下载
IE和Edge 采用了 navigator.msSaveBlob 方法此方法为IE10及以上特有，IE10以下勿采用
非微软浏览器使用a标签的click事件进行下载
代码：

rows: [
  {
   
    title: '序号',
    key: 'Ordinal',
    align: 'center'
  },
  {
   
    title: '产品编号',
    key: 'ProductNo',
    align: 'left'
  }
],
fields: ['title','key','align']
download()