具體實(shí)現(xiàn)
1仆葡、安裝相關(guān)依賴
npm install file-saver
npm install jszip
2贴捡、參考源碼
/**
* 多文件打包并下載
* @param files 待下載的文件列表
* @param filename 下載的目標(biāo)文件名
*/
const download = (files, filename) => {
let zip = new JSZip();
let folder = zip.folder('files');
Promise.resolve().then(() => {
return files.reduce((accumulator, file) => {
return accumulator.then(() => fetch(file.url)
.then(resp => resp.blob())
.then(blob => folder.file(file.name, blob)))
}, Promise.resolve())
}).then(() => {
folder.generateAsync({type: "blob"}).then(content => saveAs(content, filename));
})
}
3叙谨、測(cè)試
const files = [
{name: 'antd.css', url: 'https://cdn.bootcdn.net/ajax/libs/antd/4.12.3/antd.css'},
{name: 'antd.js', url: 'https://cdn.bootcdn.net/ajax/libs/antd/4.12.3/antd.js'}
]
download(files, 'antd.zip');
