這里說下qrcode 這個插件 生成二維碼，并且可以點擊下載

效果：后臺獲取數(shù)據(jù)渲染

1.安裝qrcode npm install qrcode
2.在需要的頁面中 import QRCode from 'qrcode’
3.html

mounted() {let canvas = this.$refs.canva; //渲染的時候是個數(shù)組所以跟單個畫圖還有點不一樣 得到的是個數(shù)組for(let i in canvas){QRCode.toCanvas(canvas[i], this.$store.state.userInfo.projectVoList[i].join_manage_url, function (error) {//第二個參數(shù)是urlif (error) console.error(error)console.log('success!');})}},

4.效果

5。點擊按鈕保存圖片，這是一個canvas

<el-button type="primary" @click="exportCanvasAsPNG('erweima',index)">下&nbsp;載</el-button>exportCanvasAsPNG( fileName,index) { var canvasElement = this.$refs.canva[index];var MIME_TYPE = "image/png";var imgURL = canvasElement.toDataURL(MIME_TYPE);var dlLink = document.createElement('a');dlLink.download = fileName;dlLink.href = imgURL;dlLink.dataset.downloadurl = [MIME_TYPE, dlLink.download, dlLink.href].join(':');document.body.appendChild(dlLink);dlLink.click();document.body.removeChild(dlLink);},

6：效果

總結(jié)

以上是生活随笔為你收集整理的生成二维码 并可以点击下载(多个二维码一起渲染)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。