前端生成二维码 + 页面局部打印

最新推荐文章于 2024-04-25 09:59:55 发布

菜菜的蜗牛

最新推荐文章于 2024-04-25 09:59:55 发布

阅读量597

点赞数 1

分类专栏：前端文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/m0_67206644/article/details/128577622

版权

一、使用vue-qr 生成二维码

1.下载 vue-qr

 npm install vue-qr --save

2.引入

import vueQr from 'vue-qr/src/packages/vue-qr.vue'

3.页面使用

text 就是二维码传递的数据
我是单独封装的组件

  <vueQr
    ref="qrcode"
    :logoScale="0.3"
    :text="text"
    correntLevel="0"
    :size="200"
    magin="auto"
    colorDark="black"
    colorLight="white"
  ></vueQr>

二、前端局部打印页面

1.html

//因为不想在页面中展示这个盒子，所以设置了 display: none
  <div style="display: none">   
    <!--startprint-->
    // 中间这一块是  要局部打印的内容    我是需要打印的一个循环数组
    <div v-for="item in qsCodeList" :key="item.id" style=&