vue在表格中使用qrcodejs2生成二维码

使用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即可，至此就可以在表格中生成二维码。