vue 文件导出demo

1api 会和普通调用的不同

export function exportBalance(params) {
  return request
    .post('/api-crm-order//crm/provider/balance/exportBalance', Qs.stringify(params, {
      arrayFormat: "indices",
      allowDots: true
    }), {
      responseType: "blob"
    })
}

2.调用接口

    exportView () {
      let ids = []
      this.selectList.forEach((item, index) => {
        ids.push(item.id);
      });
      exportBalance({
        ids //参数
      }).then(res => {
        const blob = new Blob([res]);
        let myDate = new Date();
        let timename = myDate
          .toLocaleDateString()
          .split("/")
          .join("-");
        const str = "导出文件名";
        const fileName = str + timename + ".xls";
        const linkNode = document.createElement("a");
        linkNode.download = fileName; //a标签的download属性规定下载文件的名称
        linkNode.style.display = "none";
        linkNode.href = URL.createObjectURL(blob); //生成一个Blob URL
        document.body.appendChild(linkNode);
        linkNode.click(); //模拟在按钮上的一次鼠标单击
        URL.revokeObjectURL(linkNode.href); // 释放URL 对象
        document.body.removeChild(linkNode);
      });
    },
原文地址:https://www.cnblogs.com/xiaoxiao2017/p/13962158.html