导入导出excel表格的实现

最新推荐文章于 2024-02-28 01:00:00 发布

zhou_mu_mu_xi

最新推荐文章于 2024-02-28 01:00:00 发布

阅读量278

点赞数

本文链接：https://blog.csdn.net/zhou_mu_mu_xi/article/details/116915531

版权

这篇博客详细介绍了如何在前端实现Excel的导入导出功能。首先通过npm安装file-saver、xlsx和script-loader依赖包，然后创建Excel文件夹并放入Blob.js和Export2Excel.js，接着讲解了这两个文件的使用方法。此外，还讨论了前端下载二进制流文件以及利用element UI进行文件上传的操作。

摘要由CSDN通过智能技术生成

一、使用Export2Excel
1、安装依赖包：npm install -S file-saver
npm install -S xlsx
npm install -D script-loader
2、在src目录下新建Excel文件夹，里面放入Blob.js和Export2Excel.js两个JS文件，Blob.js和 Export2Excel.js文件下载自行百度
3、使用方法

  exportCheck() {
      let exportData = this.tableData;//这里是你要下载的数据，我当时有下载当前页和下载选中项两个选择
      require.ensure([], () => {
        const {export_json_to_excel } = require("@/utils/excel/Export2Excel.js"); //注意这个Export2Excel路径
        
        const tableHeader = [ "标题1","标题2","标题3",]; // 设置Excel表格的表头
        
        const filterVal = ["title1", "title2","title3",]; // 跟表格表头对应的绑定的prop
        
        let list = JSON.parse(JSON.stringify(exportData)); //用filterTableData方法先处理一下数据格式(要进行深度拷贝，以免过滤的时候，影响页面上展示的数据)，再存到list
        let data = this.formatJson(filterVal, list);
        export_json_to_excel(tableHeader, d