31 lines
974 B
Vue
31 lines
974 B
Vue
<script setup lang="js">
|
|
import { saveAs } from "file-saver";
|
|
import JSZip from "jszip";
|
|
|
|
// 假设这些是文件数据和它们的路径
|
|
const files = [
|
|
{ name: "file1.txt", folder: "folder1", content: "This is file 1 content" },
|
|
{ name: "file2.txt", folder: "folder2", content: "This is file 2 content" },
|
|
{ name: "file3.txt", folder: "folder1", content: "This is file 3 content" },
|
|
{ name: "file4.txt", folder: "folder3", content: "This is file 4 content" },
|
|
];
|
|
|
|
async function createZip() {
|
|
const zip = new JSZip();
|
|
|
|
// 遍历文件列表，将文件按文件夹添加到 ZIP 文件中
|
|
files.forEach((file) => {
|
|
// 创建文件夹并将文件添加到对应的文件夹下
|
|
zip.folder(file.folder).file(file.name, file.content);
|
|
});
|
|
|
|
// 生成并下载 ZIP 文件
|
|
const content = await zip.generateAsync({ type: "blob" });
|
|
saveAs(content, "files.zip");
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<el-button @click="createZip">测试</el-button>
|
|
</template>
|