前端使用XLSX插件实现导入功能
前端使用XLSX插件实现导入功能,具体代码实现:1.npm install xlsx --save 下载安装xlsx插件依赖包2.在使用得地方引入import XLSX, { utils } from ‘xlsx’;3.把excel数据转成json传给后端4.* @description解析表格文件数据,返回表格中内容,目前暂不支持导入有单元格合并的表格* @param{Object} file导
·
前端使用XLSX插件实现导入功能,具体代码实现:
1.npm install xlsx --save 下载安装xlsx插件依赖包
2.在使用得地方引入import XLSX, { utils } from ‘xlsx’;
3.把excel数据转成json传给后端;
* @description 解析表格文件数据,返回表格中内容,目前暂不支持导入有单元格合并的表格
* @param {Object} file 导入的文件,二进制数据流
* @returns {Object} data 返回的表格数据
* @returns {Array} data.title 表头
* @returns {Array} data.body 表格数据
*/
async importFromLocal(file) {
const workBook = (await this.readerWorkBookFromLocal(file)) as any,
workSheet = workBook.Sheets[workBook.SheetNames[0]],
content = utils.sheet_to_json(workSheet) as any,
data = [];
(data as any).title = Object.keys(content[0]);
(data as any).body = content;
return data;
}
使用
private async importData() {
const el = document.getElementById('file') as any;
const file = el.files[0];
let data = (await Excel.importFromLocal(file)) as any;
el.value = '';
data.body.shift();
console.log('data', data);
const res = await post(ApiUrl.getUrl, data.body);
if (res.code === 200) {
this.$message({
message: '导入成功',
type: 'success'
});
} else {
this.$message.error(res.msg);
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)