前端vue项目二维码生成(带源码)

安装

npm install vue-qr --save

挂载

main.js全局挂载

import vueQr from 'vue-qr'
Vue.use(vueQr)

使用

logoSrc为logo的url地址(使用require的方式)；text为需要转换为二维码的内容

源码

<template>
  <div>
    <!-- <vue-qr :logoSrc="imageUrl" text="xxx" :size="200"></vue-qr> -->
    <vue-qr logoSrc="https://img1.baidu.com/it/u=1966616150,2146512490&fm=253&fmt=auto&app=138&f=JPEG?w=751&h=500" text="xxx" :size="200"></vue-qr>
  </div>
</template>

<script>
export default {
  data () {
    return {
      // imageUrl: require("https://img1.baidu.com/it/u=1966616150,2146512490&fm=253&fmt=auto&app=138&f=JPEG?w=751&h=500"),
    }
  },
}
</script>

效果

最后

感觉文章好的话记得点个心心和关注和收藏，有错的地方麻烦指正一下，如果需要转载,请标明出处，多谢！！！