vue-qrcode的GitHub网址：https://github.com/fengyuanchen/vue-qrcode
- 安装vue-qrcode
npm install @chenfengyuan/vue-qrcode vue
- 全局引用
// 在main.js中
import VueQrcode from '@chenfengyuan/vue-qrcode';
Vue.component(VueQrcode.name, VueQrcode)
// 在页面需要生成二维码的地方插入组件
// <qrcode value="需要生成二维码的链接" :options="{ width: 200 }"></qrcode>
// 举例：
<el-table-column label="二维码" align="center">
<template slot-scope="scope">
<qrcode :value="scope.row.qr_code" :options="{ width: 60 }"></qrcode>
</template>
</el-table-column>
- 单个页面使用组件
// 在页面中引入文件
import VueQrcode from '@chenfengyuan/vue-qrcode';
components: {
qrcode: VueQrcode
},
// 在需要的位置插入组件：
<el-table-column label="二维码" align="center">
<template slot-scope="scope">
<qrcode :value="scope.row.qr_code" :options="{ width: 60 }"></qrcode>
</template>
</el-table-column>
