vue一维码，二维码生成

一.条形码
安装依赖：

npm install jsbarcode --save

案例

<template>
    <canvas id="barCode"></canvas>
</template>
<script>
import JsBarcode from 'jsbarcode'
export default {
   
  data () {
   
    return {
   
      bindBarCode (selector, data = '1129867908') {
   
        JsBarcode(selector, data, {
   
          background: '#eee',
          displayValue: false,
          // width: 1, // 
          height: 80, // 一维码的高度
          margin: 10 // 一维码与容器的margin
        })
      }
    }
  },
  mounted () {
   
    this.bindBarCode('#barCode')
  }
}
</script>

一.二维码

npm install --save qrcode

案例

<template>
	<div>
    	<img :src="QRImgUrl" />
    </div>
</template>

<script>
import QRCode from 'qrcode'
export default {
   
  data() {
   
    return {
   
    	QRImgUrl: '',
    	QRlink:'www.xxx.com'
    }
  },
  created() {
   
    this.getQRcode('888')
  },
  methods: {
   
  	getQRcode(v){
   
  		QRCode.toDataURL(v, {
    errorCorrectionLevel: 'L', margin: 2, width: 128 }, (err, url) => {
   
          if (err) throw err
          this.QRImgUrl= url
        })
  	}
  }
}
</script>

</script>