vue base64转file

在 Vue 中，可以通过以下方式将 Base64 编码的字符串转换为 File 对象：

function dataURLtoFile(dataUrl, fileName) {
  // 将 Base64 编码的字符串转换为 ArrayBuffer
  const arrBuffer = atob(dataUrl.split(',')[1]).split('').map(char => char.charCodeAt(0));
  const byteArr = new Uint8Array(arrBuffer);
  // 创建 Blob 对象，并设置类型为图片类型
  const blob = new Blob([byteArr], { type: 'image/jpeg' });
  // 创建 File 对象，并设置文件名
  return new File([blob], fileName, { type: 'image/jpeg' });
}

上述代码中，`dataUrl` 为 Base64 编码的字符串，`fileName` 为转换后的文件名。函数内部将字符串转换为 ArrayBuffer，然后创建 Blob 对象并设置类型为图片类型，最后创建 File 对象并设置文件名，返回转换后的 File 对象。

使用时可以在组件中调用该函数，例如：

<template>
  <div>
    <img :src="imageUrl" alt="">
    <button @click="handleUpload()">上传图片</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: ''
    }
  },
  methods: {
    handleUpload() {
      const file = dataURLtoFile(this.imageUrl, 'image.jpg');
      // 将 File 对象传递给后端进行上传或存储
      console.log(file);
    }
  }
}
</script>

需要注意的是，上述代码中的 `imageUrl` 是在组件内部绑定的图片地址，需要在实际应用中将其替换为实际的 Base64 编码字符串。