为了实现文件流压缩，我们可以使用 JSZip 和 FileSaver 这两个第三方库。JSZip 是一个用于创建、读取和编辑 .zip 文件的 JavaScript 库，而 FileSaver 则用于在客户端保存文件。

• ‌JSZip‌：用于创建和操作zip文件。可以通过 file 方法将文件添加到zip中，通过 generateAsync
  方法生成zip文件。 ‌
• ‌FileSaver‌：用于将生成的zip文件保存到本地。通过 saveAs 方法可以实现文件保存。

首先要安装插件

npm install jszip file-saver

然后，在Vue组件中编写代码实现文件流压缩功能。

<template>
  <div>
    <button @click="downloadZip">下载压缩包</button>
  </div>
</template>

<script>
import JSZip from 'jszip';
import { saveAs } from 'file-saver';
import axios from 'axios';

export default {
  methods: {
    async downloadZip() {
      const zip = new JSZip();
      // 下面是示例文件名，项目中改成勾选的数据
      const fileNames = ['file1.txt', 'file2.txt', 'file3.txt']; // 示例文件名
      const promises = fileNames.map(fileName => this.getFileAsStream(fileName).then(blob => {
        zip.file(fileName, blob);
      }));
      await Promise.all(promises);
      const content = await zip.generateAsync({ type: 'blob' });
      saveAs(content, '批量下载.zip');
    },
    async getFileAsStream(fileName) {
      // 这里假设你有一个后端接口可以返回文件流
      const response = await axios.get(`/path/to/your/api/${fileName}`, {
        responseType: 'arraybuffer' // 如果不行改成blob 
      });
      const blob = new Blob([response.data], { type: 'application/octet-stream' });
      return blob;
    }
  }
};
</script>