- 安装qrcode
npm install qrcode --save
- 代码
<template><div style="display: flex; flex-direction: column; align-items: center; justify-content center;"><div>查看溯源码,<a id="saveLink" style="text-decoration:underline">点击保存</a></div><canvas id="qrcode-canvas"></canvas></div>
</template>
<script>
import QRCode from 'qrcode'
export default {return data(){url: "", },mounted(){generateQRCode(this.url)}
}generateQRCode(url) {const canvas = document.getElementById('qrcode-canvas') QRCode.toCanvas(canvas, url, {width:120,height:120})var dataURL = canvas.toDataURL("image/png")const a = document.getElementById("saveLink")a.href = dataURLa.download = `二维码.png`
}
</script>
- 演示