前端导出blob文件

导出Excel文件方法

最新推荐文章于 2024-10-24 11:14:45 发布

原创最新推荐文章于 2024-10-24 11:14:45 发布 · 414 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端

Vue 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现从Web应用中导出数据到Excel文件的方法。具体步骤包括构造导出请求的数据对象、发送HTTP请求获取二进制数据、利用Blob对象创建临时下载链接并触发点击事件来实现文件下载。

1.接口调用

/** 导出按钮操作 */
handleExport() {
  let obj = {
    name: this.form.sqlName,
    content: this.form.sqlContent,
    // content: encrypt(this.form.sqlContent),
    programId: this.programId,
    userId: this.user.userId,
    userCode: this.user.userCode,
    dataSourceId: this.form.dataSourceId,
    database: this.form.dataBaseName,
  };
  exportData(obj).then((res) => {
    // 该实例化的方式第一个参数必须是数组的格式
    const blob = new Blob([res], {
      type: 'application/vnd.ms-excel',
    });

    const url = window.URL.createObjectURL(blob)
    const a = document.createElement('a');
    a.href = url;
    a.download = '导出文件';
    a.click();
    window.URL.revokeObjectURL(url);
  }).catch((r) => {
    console.error(r)
  })