vue base64转下载

可以使用以下代码实现vue中base64转下载：

downloadFile(base64String, fileName) {
  const linkSource = `data:application/pdf;base64,${base64String}`;
  const downloadLink = document.createElement("a");
  downloadLink.href = linkSource;
  downloadLink.download = fileName;
  downloadLink.click();
}

其中，`base64String`是需要转换的base64字符串，`fileName`是下载的文件名。

在使用时，可以调用该方法：

this.downloadFile(base64String, fileName);

其中，`this`是Vue组件实例。

相关问题

vue 下载base64图片

在Vue中下载Base64图片可以通过以下步骤实现：

1. 首先，将Base64图片数据转换为Blob对象。可以使用`atob`函数将Base64字符串解码为二进制数据，然后创建一个Uint8Array数组，并将解码后的数据存入其中。最后，使用`new Blob()`函数将数组转换为Blob对象。

function base64ToBlob(base64Data) {
  const byteCharacters = atob(base64Data);
  const byteArrays = [];

  for (let offset = 0; offset < byteCharacters.length; offset += 512) {
    const slice = byteCharacters.slice(offset, offset + 512);

    const byteNumbers = new Array(slice.length);
    for (let i = 0; i < slice.length; i++) {
      byteNumbers[i] = slice.charCodeAt(i);
    }

    const byteArray = new Uint8Array(byteNumbers);
    byteArrays.push(byteArray);
  }

  return new Blob(byteArrays, { type: 'image/png' }); // 根据实际图片类型进行修改
}

2. 创建一个下载链接并设置其属性。使用`URL.createObjectURL()`函数创建一个临时的URL，然后将其赋值给下载链接的`href`属性。同时，设置链接的`download`属性为所需的文件名。

function downloadImage(blob, fileName) {
  const url = URL.createObjectURL(blob);

  const link = document.createElement('a');
  link.href = url;
  link.download = fileName;
  link.click();

  URL.revokeObjectURL(url);
}

3. 调用上述函数进行下载。在Vue组件中，可以在需要下载图片的地方调用上述函数，传入Base64数据和文件名。

// 在Vue组件中的方法中调用
downloadBase64Image() {
  const base64Data = '...'; // 替换为实际的Base64图片数据
  const fileName = 'image.png'; // 替换为实际的文件名

  const blob = base64ToBlob(base64Data);
  downloadImage(blob, fileName);
}

这样，当调用`downloadBase64Image`方法时，会触发下载操作，将Base64图片保存为文件。

vue实现base64图片下载

可以使用js-base64库将图片转换为base64格式，然后使用a标签的download属性实现下载。以下是示例代码：

import { Base64 } from 'js-base64';

// 将图片转换为base64格式
const imageUrl = 'http://example.com/image.jpg';
const base64Image = await fetch(imageUrl)
  .then(res => res.arrayBuffer())
  .then(buffer => Base64.fromUint8Array(new Uint8Array(buffer)));

// 创建可下载的链接
const link = document.createElement('a');
link.href = `data:image/jpeg;base64,${base64Image}`;
link.download = 'image.jpg';
document.body.appendChild(link);

// 触发下载
link.click();

// 移除链接
document.body.removeChild(link);

注意，该方法只适用于小文件下载，大文件会导致浏览器卡死。如果需要下载大文件，建议使用其他方法，如分片下载。