基于SpringBoot-Vue-EasyExcel实现的Excel文件导出+导入

一:easyExcel依赖

         <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>easyexcel</artifactId>
            <version>2.1.6</version>
        </dependency>

二:javaBean

@Data
@AllArgsConstructor
@NoArgsConstructor
public class Users {
    
    private String id;

    @ExcelProperty(value = {"用户姓名"}, index = 1)
    private String name;

    @ExcelProperty(value = {"用户年龄"}, index = 2)
    private String age;

}

三:Controller

@PostMapping ("/excel")
    public void export(HttpServletResponse response, HttpServletRequest request) {
        ServletOutputStream outputStream = null;

        // excel头策略
        WriteCellStyle headWriteCellStyle = new WriteCellStyle();
        WriteFont headWriteFont = new WriteFont();
        headWriteFont.setFontHeightInPoints((short) 11);
        headWriteFont.setBold(false);
        headWriteCellStyle.setWriteFont(headWriteFont);

        // excel内容策略
        WriteCellStyle contentWriteCellStyle = new WriteCellStyle();
        WriteFont contentWriteFont = new WriteFont();
        contentWriteFont.setFontHeightInPoints((short) 11);
        contentWriteCellStyle.setWriteFont(contentWriteFont);
        contentWriteCellStyle.setHorizontalAlignment(HorizontalAlignment.CENTER);

        // 设置handler
        HorizontalCellStyleStrategy styleStrategy =
            new HorizontalCellStyleStrategy(headWriteCellStyle, contentWriteCellStyle);

        // Data
        List<Users> list = new ArrayList<>();
        list.add(new Users("1", "小明", "11"));
        list.add(new Users("2", "小红", "11"));
        list.add(new Users("3", "小白", "11"));
        list.add(new Users("4", "小绿", "11"));
        list.add(new Users("5", "小灰", "11"));

        try {
            outputStream = response.getOutputStream();
            EasyExcel.write(outputStream, Users.class)
                .sheet()
                .registerWriteHandler(styleStrategy)
                .doWrite(list);
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            if (outputStream != null) {
                try {
                    outputStream.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
    }

四:vue代码

       exportExcel() {
            axios({
                    method: 'post',
                    url: '/excel',
                    responseType: 'blob',
                }
            ).then(function (response) {
                let blob = new Blob([response.data], { type: 'application/vnd.ms-excel;charset=utf-8' })
                let downloadElement = document.createElement('a');
                let href = window.URL.createObjectURL(blob); //创建下载的链接
                downloadElement.href = href;
                downloadElement.download = '哈哈哈.xlsx'; //下载后文件名
                document.body.appendChild(downloadElement);
                downloadElement.click(); //点击下载
                document.body.removeChild(downloadElement); //下载完成移除元素
                window.URL.revokeObjectURL(href); //释放掉blob对象

            }).catch(function (error) {
                this.$message.error(error)
            });
        }

在这里插入图片描述
在这里插入图片描述

五:导入

5.1:excel监听器

public class WebStudentListener<T> extends AnalysisEventListener<T> {
    public final Logger log = LoggerFactory.getLogger(this.getClass());

    public List<T> list = new ArrayList<>();
    @Override
    public void invoke(T t, AnalysisContext analysisContext) {
        log.info("读取表格[{}]",t);
        System.out.println(t.toString()+"t");
        list.add(t);
    }

    @Override
    public void doAfterAllAnalysed(AnalysisContext analysisContext) {

    }
    public List<T> getExcelData(){
        return list;
    }
}

5.2 接口

    @PostMapping("/redexcel")
    @ResponseBody
    public List<Users> redExcel(HttpServletResponse response, HttpServletRequest request, MultipartFile multipartFile) throws IOException {
        InputStream inputStream = multipartFile.getInputStream();
        WebStudentListener<Users> studentWebStudentListener = new WebStudentListener<>();
        EasyExcel.read(inputStream,Users.class,studentWebStudentListener).sheet().doRead();
        List<Users> excelData = studentWebStudentListener.getExcelData();
        return excelData;
    }

5.3 前端组件element upload

        <el-upload
            class="upload-demo"
            action="http://localhost:8082/redexcel"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :on-success="uploadSuccess"
            multiple
            name="multipartFile"
            :limit="3">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
        </el-upload>
           uploadSuccess (response, file, fileList) {
            console.log(response)
           },
           
           handleRemove (file, fileList) {
            console.log(file, fileList)
           },
           
           handlePreview (file) {
            console.log(file)
           },
           
  • 7
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值