使用easypoi导出Excel表格
注:前端是使用layui
需要在pom文件写入easypoi的maven坐标
- 步骤一:在后台将需要导出的用个List返回给前端
- 步骤二:在前端写上按钮以及调用方法
<div class="layui-inline">
<button class="layui-btn" onclick="exportUserInfo()">
<i class="layui-icon"></i>导出用户数据
</button>
</div>
<script type="text/javascript" th:inline="javascript">
var layui_exts = /*[[@{/js/layui_exts/}]]*/;
layui.config({
base: layui_exts,
}).extend({
excel: 'excel',
});
</script>
function exportUserInfo() {
layui.use(['jquery', 'excel', 'layer'], function () {
var $ = layui.jquery;
var layer = layui.layer;
var excel = layui.excel;
layer.open({type: 3, time: 30000});
// 模拟从后端接口读取需要导出的数据
$.ajax({
url: url_export_user_data,
type: 'GET',
success: function (res) {
console.table(res);
res = excel.filterExportData(res, {
name: function (value, line, data) {
return value || ''
},
nickName: function (value, line, data) {
return value || ''
},
organ: function (value, line, data) {
return value || ''
},
position: function (value, line, data) {
return value || ''
},
level: function (value, line, data) {
return value || ''
},
field: function (value, line, data) {
return value || ''
},
phone: function (value, line, data) {
return value || ''
},
email: function (value, line, data) {
return value || ''
},
card: function (value, line, data) {
return value || ''
},
money: function (value, line, data) {
return value || ''
},
investor: function (value, line, data) {
return value || ''
},
pioneer: function (value, line, data) {
return value || ''
}
});
// 重点2!!!一般都需要加一个表头,表头的键名顺序需要与最终导出的数据一致
res.unshift({
'name': 'app昵称',
'nickName': '认证姓名',
'organ': '机构',
'position': '职位',
'level': '轮次',
'field': '赛道',
'phone': '手机号',
'email': '邮箱',
'card': '名片',
'money': '投资金额(万元)',
'investor': '是否是投资人',
'pioneer': '是否是创业者'
});
excel.exportExcel({
sheet1: res
}, '用户信息.xlsx', 'xlsx');
layer.closeAll('loading');
layer.alert('导出成功');
},
error: function () {
layer.closeAll('loading');
layer.alert('导出失败,请联系管理员');
}
});
});
}