React 는 배경 그림 경 로 를 통 해 사진 을 포장 하여 다운로드 합 니 다.
npm i file-saver --save -dev
npm i jszip --save -devjszip.js
import JSZip from 'jszip'
import FileSaver from 'file-saver'
export default function toZip(imgSrcList,fileName) {
let zip = new JSZip();//
let imgFolder = zip.folder(fileName); // ，
for(let i=0;i {
imgFolder.file((i+1)+'.jpg', getBase64Image(tempImage).substring(22), { base64: true })
}
}
setTimeout(()=>{
zip.generateAsync({ type: 'blob' }).then( function(content) {
FileSaver.saveAs(content, 'images.zip')
})
},3000)
}
function getBase64Image(img) {
let canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
let ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, img.width, img.height);
let ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
let dataURL = canvas.toDataURL("image/"+ext);
return dataURL;
}
사용 방법:
// jszip.js
import toZip from 'utils/jszip'
//
toZip(imgSrcList,fileName);이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
JS 판단 수조 네 가지 실현 방법 상세그러면 본고는 주로 몇 가지 판단 방식과 방식 판단의 원리를 바탕으로 문제가 있는지 토론하고자 한다. 예를 들어 html에 여러 개의 iframe 대상이 있으면 instanceof의 검증 결과가 기대에 부합되지 않을...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
