使用vue在表格中生成二维码，首先先安装qrcode插件npm i qrcodejs2然后需要生成的vue中import引入
自定义一个组件 具体代码如下
<template>
<div :id="id" class="qrcode"></div>
</template>
<script>
import QRCode from 'qrcodejs2'
export default {
name: 'qrcode',
props: {
url: {
type: String,
default: ''
},
id: {
type: String,
default: ''
}
},
data() {
return {}
},
methods: {
qrcode() {
this.$nextTick(() => {
document.getElementById(this.id).innerHTML = ''
let qrcode = new QRCode(this.id, {
text: this.url,
width: 110,
height: 110
})
})
}
},
mounted() {
this.qrcode()
}
}
</script>
<style scoped lang="less">
.qrcode {
display: flex;
align-items: center;
justify-content: center;
}
</style>
然后在需要使用该组件地引入，只需要传入id和url即可，至此就可以在表格中生成二维码。
