js 生成二维码

第一种,需要先下载包 npm install qrcode

javascript 复制代码
<template>
  <div>
    <h2>二维码</h2>
    <img :src="qrCodeImage" alt="">
  </div>
</template>

<script>
import QRCode from 'qrcode'
export default {
  data () {
    return {
      qrCodeImage: ''
    }
  },
  created () {
    this.generateQRCode('https://element.eleme.cn/#/')
  },
  methods: {
    async generateQRCode (url) {
      const opts = { errorCorrectionLevel: 'H' }
      this.qrCodeImage = await QRCode.toDataURL(url, opts)
    }
  }
}
</script>

<style>
</style>

第二种不需要下载包,只需要改'data='后面的地址

javascript 复制代码
<template>
  <div>
    <h2>二维码</h2>
    <img src='https://api.qrserver.com/v1/create-qr-code?data=https://element.eleme.cn/#/'>
  </div>
</template>


<script>
export default {
  data () {
    return {
    }
  }
}
</script>

<style>
</style>
相关推荐
赴前尘11 分钟前
golang 查看指定版本库所依赖库的版本
开发语言·后端·golang
de之梦-御风25 分钟前
【C#.Net】C#开发的未来前景
开发语言·c#·.net
知乎的哥廷根数学学派1 小时前
基于数据驱动的自适应正交小波基优化算法(Python)
开发语言·网络·人工智能·pytorch·python·深度学习·算法
de之梦-御风1 小时前
【C#.Net】C#在工业领域的具体应用场景
开发语言·c#·.net
sunfove1 小时前
将 Python 仿真工具部署并嵌入个人博客
开发语言·数据库·python
Learner1 小时前
Python类
开发语言·python
X1A0RAN2 小时前
python 借助 paramiko 库执行 SSH命令报错:input is not a terminal 解决方式
开发语言·python·ssh
冰清-小魔鱼2 小时前
各类数据存储结构总结
开发语言·数据结构·数据库
摘星编程3 小时前
React Native for OpenHarmony 实战:Linking 链接处理详解
javascript·react native·react.js
Mr -老鬼3 小时前
Java VS Rust
java·开发语言·rust