vue导出功能实现

<el-col

      :span="24"

      class="button-box"

      style="padding-left:0;display: flex;align-items: center;"

    >

      <div class="btn" @click="exportR">

        <i class="gw-daochu daochu" style="color:#FEBC59"></i>

        <span>导出</span>

      </div>

    </el-col>

 

exportR() {

      personService.download(this.param).then(res => {

        this.exportExcel(res.data, "人力编制监控");

      });

    },

    exportExcel(data, name = "demo") {

      let blob = new Blob([data], { type: "application/vnd.ms-excel" }); // 设置文件类型excel

      let url = window.URL.createObjectURL(blob); // 创建一个临时的url指向blob对象

      // 创建url之后可以模拟对此文件对象的一系列操作，例如：预览、下载

      let a = document.createElement("a");

      a.href = url;

      a.download = name + ".xlsx";

      a.click();

      // 释放这个临时的对象url

      window.URL.revokeObjectURL(url);

    },

personService.download导出接口 

this.param  el-form ref