本來是由後臺生成二維碼的，但是測試後不是很穩定，由於網路問題有時候會載入不過來。。。

之後就發現vue的兩個外掛：vue-qart和vue-qr。對比之後發現，vue-qr的配置更全一些，所以選擇了vue-qr

vue-qart：

1、npm install vue-qart --save

2、import VueQArt from 'vue-qart'

　　new Vue({    　　 components: {VueQArt} 　　}) 3、<vue-q-art :config="config"></vue-q-art>

4、 data () {     　　return {        　　 config: {            　　 value: 'https://www.baidu.com',             　　imagePath: require('../assets/logo.png'),　　//注意這裡的圖片使用require

            　　filter: 'color'         　　}    　　 } 　　}

 

vue-qr:

1、npm install vue-qr --save

2、import VueQr from 'vue-qr'

　　new Vue({    　　 components: {VueQr} 　　}) 3、<vue-qr :bgSrc='config.imagePath' :logoSrc="config.imagePath" text="Hello world!" :colorDark="BYTE_POS" :size="200"></vue-qr> 4、data () {     　　return {        　　 config: { 　　　　　value: 'www.baidu.com',　　//顯示的值、跳轉的地址            　　imagePath: require('../assets/logo.png'),　　//中間logo的地址 　　　　　BYTE_POS: 'green'         　　}    　　 } 　　}     配置如下： bgSrc----背景圖 logoSrc---欲嵌入至二維碼中心的 LOGO 地址 colorDark---實點顏色 colorLight---空白區顏色 dotScale---資料區域點縮小比例