1. 程式人生 > >vue中實現二維碼生成

vue中實現二維碼生成

安裝 :  npm install --save qrcodejs2

js部分:

<script>
    import QRCode from 'qrcodejs2'
    export default {
        methods: {
                 qrcode () {
                 let qrcode = new QRCode('qrcode', {
                     width: 100,
                     height: 100, // 高度  [圖片上傳失敗...(image-9ad77b-1525851843730)]
                     text: 'https://mp.csdn.net/postedit/83183772' // 二維碼內容
                 // render: 'canvas' // 設定渲染方式(有兩種方式 table和canvas,預設是canvas)
                 // background: '#f0f'
                  // foreground: '#ff0'
              })
                  console.log(qrcode)
            }
     },
     mounted () {  //呼叫
          this.qrcode()
     }
    }
</script>

內容部分:

<template>
    <div id="qrcode">二維碼生成的位置</div>
</template>