zoukankan      html  css  js  c++  java
  • vue基于Blob.js和 Export2Excel.js做前端导出

    1安装三个依赖包

    npm install -S file-saver
    npm install -S xlsx
    npm install -D script-loader
    

    2导入两个js

    下载Blob.js和Export2Excel.js,在src目录下新建Excel文件夹,里面放入Blob.js和Export2Excel.js两个JS文件,下面有

     链接: https://pan.baidu.com/s/1kmpEq2If39HbHFrXdpQRPw 密码: 2694 (有这两个文件) 

    3.main.js 引入文件

    import Blob from './Excel/Blob'
    import Export2Excel from './Excel/Export2Excel.js'
    

    组件中使用

    //导出的方法
    exportExcel() {
      require.ensure([], () => {
        const { export_json_to_excel } = require('../Excel/Export2Excel');//注意这个Export2Excel路径
        const tHeader = ['序号', '昵称', '姓名'];   // 上面设置Excel的表格第一行的标题
        const filterVal = ['index', 'nickName', 'name']; // 上面的index、nickName、name是tableData里对象的属性key值
        const list = this.tableData;  //把要导出的数据tableData存到list
        const data = this.formatJson(filterVal, list);
        export_json_to_excel(tHeader, data, '列表excel');//最后一个是表名字
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    }

    5.如果报错,可能路径问题

      

  • 相关阅读:
    非线性数据结构——树
    排序算法之插入排序
    web框架之environment处理
    web开发之http和wsgi
    python os模块和shutil模块
    python路径操作
    stringIO和bytesIO
    python文件操作
    设计模式
    设计模式
  • 原文地址:https://www.cnblogs.com/lizhao123/p/12564234.html
Copyright © 2011-2022 走看看