vue2结合Element-ui的导出xlsx文件功能

最新推荐文章于 2024-05-07 15:39:50 发布

明天。。。

最新推荐文章于 2024-05-07 15:39:50 发布

阅读量283

点赞数 1

分类专栏： Element 文章标签： elementui vue.js javascript

本文链接：https://blog.csdn.net/m0_53756162/article/details/122242780

版权

Element 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

 <el-button
          type="success"
          plain
          icon="el-icon-upload2"
          size="mini"
          @click="handleExport"
          >导出</el-button
  >

import request from '@/utils/request';

 // 导出接口
export function laborPollExport(query) {
  return request({
    // url: '/customer/v0.1/customer/company/export',
    url: '/customer/v0.1/customer/flexible/export',
    method: 'post',
    data: query,
    responseType:'arraybuffer'
  });
}

 // 引入导出接口
 import {laborPollExport} from '@/api/employment/laborPoll';

  //导出事件
    handleExport() {
      this.$confirm('是否导出用工池列表?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        // laborPollExport  导出接口
        const res = await laborPollExport({
          orderState: this.queryParams.orderState,
          platformGuid: this.queryParams.platformGuid,
          authenticationStatus: this.queryParams.authenticationStatus,
          registrant: this.queryParams.registrant,fileName:'用工池列表',
        });
        this.$message({
          type: 'success',
          message: '导出成功'
        });
        this.isExcel('xlsx', '用工池列表', res.data);

      });
    },
    // 解决乱码
    isExcel(type, name, data) {
      const link = document.createElement('a');
      const blob = new Blob([data]);
      link.style.display = 'none';
      link.href = URL.createObjectURL(blob);
      link.setAttribute('download', `${name}.` + type);
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    },