vue3 Blob转json对象

在Vue3中，将Blob对象转换为JSON对象的方法如下所示：

const reader = new FileReader();
reader.onload = function() {
  const json = JSON.parse(reader.result);
  // 在这里可以使用转换后的JSON对象
};
reader.readAsText(blob);

上述代码中，我们首先创建一个FileReader对象，并将其绑定到`onload`事件上。然后，我们使用`readAsText`方法将Blob对象读取为文本。当读取完成后，`onload`事件将被触发，我们可以通过`reader.result`获取到转换后的JSON字符串。最后，我们可以使用`JSON.parse`方法将JSON字符串解析为JSON对象。

请注意，上述代码中的`blob`是指你要转换的Blob对象。

相关问题

vue3 下载blob

以下是在Vue3中下载blob的代码示例：

<template>
  <div>
    <button @click="downloadBlob">下载Blob</button>
  </div>
</template>

<script>
export default {
  methods: {
    async downloadBlob() {
      const response = await fetch('your_api_url', {
        method: 'GET',
        headers: {
          'Content-Type': 'application/json'
        },
        responseType: 'blob' // 设置响应类型为blob
      })
      const blob = await response.blob()
      const url = window.URL.createObjectURL(blob)
      const link = document.createElement('a')
      link.href = url
      link.setAttribute('download', 'file_name') // 设置下载文件名
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
    }
  }
}
</script>

需要注意的是，在后端接口返回的blob文件流中，需要设置流的编码为utf-8，并在下载的api里加上responseType: "blob"，以防止出现文件乱码。

vue new Blob下载table表格勾选的数据 zip格式

你可以使用JSZip库将表格数据转换为zip文件并进行下载。以下是一个示例代码：

import JSZip from 'jszip'

// 获取勾选的表格数据
const selectedData = []

// 创建JSZip实例
const zip = new JSZip()

// 将表格数据转换为文本格式并添加到zip文件中
for (const data of selectedData) {
  const text = JSON.stringify(data)
  zip.file(`${data.name}.txt`, text)
}

// 生成zip文件并下载
zip.generateAsync({ type: 'blob' }).then((content) => {
  const url = window.URL.createObjectURL(content)
  const link = document.createElement('a')
  link.href = url
  link.download = 'selectedData.zip'
  link.click()
})

你需要将上面的代码集成到你的项目中，并替换注释部分的代码以适应你的需求。请确保已经安装了JSZip库。