vue链接生成二维码

reahcriy

已于 2022-08-09 14:13:26 修改

阅读量777

点赞数

分类专栏： vue

于 2022-07-28 18:02:33 首次发布

本文链接：https://blog.csdn.net/lln_1211/article/details/126040754

版权

Vue.js qrcodejs2 二维码生成前端开发 JavaScript

关键词由CSDN通过智能技术生成

vue 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

下载

  cnpm i qrcodejs2 --save

引用

 import QRCode from "qrcodejs2";

页面用法

<div id="qrcode" ref="qrcode"></div>

配置

   qrcode () {
        let qrcode = new QRCode("qrcode", {

          width: 200, // 二维码宽度，单位像素

          height: 200, // 二维码高度，单位像素
          text:"https://blog.csdn.net/lln_1211/article/details/110872484?spm=1001.2014.3001.5502"

        })

      }

完整代码

<template>
    <div id="qrcode" ref="qrcode"></div>
</template>
<script>
  import QRCode from 'qrcodejs2'
  export default {
    mounted(){
      this.$nextTick(() => {
        this.qrcode()
      })
    },
    methods: {
      qrcode () {
        let qrcode = new QRCode("qrcode", {

          width: 200, // 二维码宽度，单位像素

          height: 200, // 二维码高度，单位像素
          text:"https://blog.csdn.net/lln_1211/article/details/110872484?spm=1001.2014.3001.5502"

        })

      }
    }
  }
</scr