vue 本地xlsx文件下载_vue---excel导入导出以及本地模板下载

选取文件

上传文件

beforeUpload(file) {

const Xls = file.name.split('.');

const islt20 = file.size / 1024 / 1024 < 20;

if (Xls[1] == 'xls' || Xls[1] == 'xlsx') {

} else {

this.$message.warning('只能上传xls或者xlsx格式的文件');

return;

}

if (!islt20) {

this.$message.warning('文件大小不能超过20M');

return;

}

this.file = file;

return true;

},

async uploadRequest() {

let formData = new FormData();

formData.append('file', this.file);

let res = await request({

baseURL: '',

url: '',

methods: 'post',

data: formData,

onUploadProgress(event){

if(event.lengthComputable){

this.percentage = Math.floor(event.loaded/event.total * 100)

}

}

});

if (res.resultCode == '00') {

this.$message.success(res.resultData.message);

} else {

this.$message.success(res.resultData.message);

}

},

submitUpload(){

this.$refs.upload.submit()

},

上传与下载

点击上传

excel 转为表格导入导出

//..................导入Excel.......................................................

importfxx(obj) {

this.file = obj;

var rABS = false; //是否将文件读取为二进制字符串

var f = this.file;

var _this = this;

var reader = new FileReader();

//读取文件内容

FileReader.prototype.readAsBinaryString = function(f) {

var binary = ''; //二进制

var rABS = false; //是否将文件读取为二进制字符串

var wb; //读取完成的数据

var reader = new FileReader();

reader.onload = function(e) {

//文件读取完会触发函数

var bytes = new Uint8Array(reader.result);

var length = bytes.byteLength;

for (var i = 0; i < length; i++) {

binary += String.fromCharCode(bytes[i]); //Unicode 编码转为一个字符

}

//如果没有在main.js中引入，则此处需要引入，用于解析excel

// var XLSX = require("xlsx");

if (rABS) {

wb = XLSX.read(btoa(fixdata(binary)), {

//手动转化

type: 'base64'

});

} else {

wb = XLSX.read(binary, {

type: 'binary'

});

}

//excel文件导出并解析成JSON,这里的条件是本地表名与Excel相同

_this.tableData = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);

_this.notifyInstance.close();

};

reader.readAsArrayBuffer(f);

};

if (rABS) {

reader.readAsArrayBuffer(f);

} else {

reader.readAsBinaryString(f);

}

},

//....................导出Excel.................................................

getExcel() {

require.ensure([], () => {

const { export_json_to_excel } = require('../../introduce/Export2Excel.js')

const tHeader = ['姓名', '年龄']

const filterVal = ['name', 'age']

const list = this.tableDate

const data = this.formatJson(filterVal, list)

export_json_to_excel(tHeader, data, '导出列表名称')

})

},

formatJson(filterVal, jsonData) {

return jsonData.map(v => filterVal.map(j => v[j]))

},