前端使用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);
		}
	}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐