vue两种方式导出excel表格

1、使用a标签链接到模版

在config下index文件中配置过assetsSubDirectory: 'static',assetsPublicPath: './',引用静态文件使用 ./ 即可

下载模版

文件必须放到static下面,否则会出现未发现文件的错误 

2、使用json数据方式生成

安装依赖

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

js文件链接: https://pan.baidu.com/s/1yrl87nCGlXVajqm2WIjM1Q  密码:360b

调用downloadTmpExcel就能生成对应数据的表格

  export default {
    methods: {
      downloadTmpExcel() {
        require.ensure([], () => {
          let { export_json_to_excel } = require('@/js/excel/Export2Excel');
          let tHeader = this.table_fields
          let filterVal = this.table_columns
          let list = this.table_data;
          let data =  list.map(v => filterVal.map(j => v[j]))
          export_json_to_excel(tHeader, data, '列表excel');
        })
      }
    },
	data() {
	  return {
	    table_fields: ["姓名","性别","年龄"],
	    table_columns: ["name","gender","age"],
	    table_data: [{
	        name: "jack",
	        gender: "1",
	        age: "30"
	      },
	      {
	        name: "rose",
	        gender: "2",
	        gender: "30"
	      }
	    ]
	  }
	}
  }

 

你可能感兴趣的:(vue)