前端生成二维码，且可以下载

首先项目引入依赖包 npm install qrcodejs2

然后在指定页面引入 import QRcode from "qrcodejs2"

页面部分，我的是一个弹窗

<el-dialog

 title="二维码"

:visible.sync="dialogVisible"

center

> 

<div>

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

<div><button @click="downloadQrcode">导出</button></div>

</div>

</el-dialog>

点击查看二维码

handleQrcodde(){

this.dialogVisible = true

setTimeout(()=>{

document.getElementById("qrcodde").innerHTML = ""   //每次清空元素，防止叠加

let qrcode = new QRcode("qrcode",{

width:188,

height:188,

colorDark:'#666',

colorLight:'#fff'

})

qrcode.clear();

qrcode.makeCode('二维码内容')

},500)

 }

下载二维码

downloadQrcode ( fileName , content ){

let  canvas = document . getElementsByTagName (" canvas ")[0]

let base64Img= canvas . toDataURL ("");

let link = document . createElement (" a ");

link. href =base64Img

 link . download =" code + Date . now ();

let event = document . createEvent (" MouseEvents ");

event . initMeuseEvent (

 click ",

 true ,

 false ,

 window ,

 false ,

 false ,

 false ,

 false ,

nu11

)

link . dispatchEvent ( event );

}