在 Vue 项目中生成 qr 码

在项目中出现二维码常见的功能，实现方案有很多种，我用的是以下这种。

使用 vue-qr

1.先安装 vue-qr

1
npm install vue-qr --save

2.声明以及引入

1
import VueQr from 'vue-qr'; export default { components: { VueQr, },

就是引入一个组件

3.使用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

<template>
    <div>
        <vue-qr :logo-src="logoSrc"
          :size="191"
          :margin="0"
          :auto-color="true"
          :dot-scale="1"
          :text="appSrc" />
    </div>
</template>
<script>
export default {
    data(){
        return {
            logoSrc:"",
            appSrc:"http://www.baidu.com"
        }
    }
}

这是官网

https://www.npmjs.com/package/vue-qr