qrcode.react组件生成的二维码打包下载

需要使用qrcode.react组件生成二维码。前端实现二维码批量打包下载。qrcode.react组件生成二维码的idea默认是canvas。将canvas转base64并集成到JSZip对象中最终生成一个zip文件并通过file-saver将需要的依赖包下载到本地qrcode.react二维码生成的react组件jszip用于打包压缩一个库文件-saverfile保存下载的插件库主代码1.HeaderimportimportJSZipfrom'jszip';importFileSaverfrom'file-saver';importQrcodefrom'qrcode.react';2.reactrender3.下载js代码//1.获取画布元素constcanvases=document.querySelectorAll(".qrcode");if(!canvans.length){returnalert("elementsisempty!");}//2.生成每个画布base64格式，放入JSZipconstzip=newJSZip();//constzipDir=zip.folder('qrcode');//你也可以为(constcanvasofcanvas)生成子文件夹{constitem={data:canvas.toDataURL().substring(22),//substringg(22)是去掉base64headername:canvan.getAttribute("name"),};//放到jszip对象中zip.file(item.name+".png",item.data,{base64:true,});}//3.以二进制形式保存，通过file-saver下载到本地zip.generateAsync({type:"blob"}).then(function(content){FileSaver.saveAs(content,"qrcodes.zip");});