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库。

相关问题

vue下载 blob zip

在中下载blob zip文件的方法如下所示：

// 下载文件
const fileRes = await axios.get(filePath, { responseType: 'blob' })
// 临时创建一个Blob对象，储存文件数据
// type: application/vnd.ms-excel;charset=utf-8 excel文件
// type: application/zip zip文件
const blob = new Blob([fileRes.data], { type: 'application/zip' })
// 创建a标签，模拟点击a标签，实现文件下载功能
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)
// 创建下载的链接
downloadElement.href = href
// 设置文件名
downloadElement.download = `${fileName}`
document.body.appendChild(downloadElement)
downloadElement.click()
document.body.removeChild(downloadElement)
window.URL.revokeObjectURL(href) // 释放掉blob对象。

vue new blob

在Vue中创建一个新的Blob对象的方法有多种。一种方法是使用`Blob`构造函数，如以下代码所示：

const data = new Blob(['Hello, World!'], { type: 'text/plain' });

这个代码将创建一个包含字符串"Hello, World!"的Blob对象，并指定它的类型为纯文本（text/plain）。

另一种方法是使用`Blob`的静态方法`Blob.from()`，如以下代码所示：

const data = Blob.from('Hello, World!', { type: 'text/plain' });

这个代码也将创建一个包含字符串"Hello, World!"的Blob对象，并指定它的类型为纯文本。

请注意，以上代码只是示例，具体的使用方式可能会根据你的应用场景有所不同。在Vue中使用Blob对象时，你可能会需要结合其他功能或库来处理和使用它，比如上述的例子中引用的`axios`、`file-saver`和`element-ui`等。你可以根据你的具体需求和项目配置来决定如何使用Blob对象。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [Vue中保存数据到磁盘文件的方法](https://download.csdn.net/download/weixin_38688097/14812508)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [Vue项目 使用new Blob() 对返回文件流下载导出文件时封装调用示例(即文件流转Blob格式实现下载)](https://blog.csdn.net/Rich_lady/article/details/127616185)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]