vue-二维码批量导出下载

最新推荐文章于 2025-05-07 17:48:03 发布

Robert_c

最新推荐文章于 2025-05-07 17:48:03 发布

阅读量1k

点赞数 1

分类专栏： vue 文章标签： vue

本文链接：https://blog.youkuaiyun.com/weixin_45736502/article/details/119569023

版权

本文介绍在Vue中如何实现二维码的批量导出和下载。首先需要安装jsZip和file-saver库，然后在Vue页面导入并使用。在用户点击按钮时，遍历所有数据生成二维码，并利用这些qrFile调用下载函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

继上次vue-qr实现二维码批量生成，今天记录下如何批量导出二维码。

首先要实现批量导出二维码，得要安装jsZip和file-saver

npm install jszip --save

npm install file-saver --save

接着在对应的页面进行导入

<script>
import vueQr from 'vue-qr'
import JSZip from "jszip";
import FileSaver from "file-saver";

export default{
    name:'demo',
    data(){
        return{

        }
    },
    methods:{

    }

}
</script>

然后点击按钮后调用函数下载

<template>
    <div class="demo>
        ...
        <a-button @click="downLoadPicture"></a-button>
    </div>
</template>

<script>
export default{
    name:'demo',
    data(){
        return{
            demoList:[
                ...