项目场景：

element-ui 框架 Dialog 中使用 JsBarcode 无法显示并且报错问题
报错：JsBarcode No element to render on

问题描述

在vue3项目中 用 JsBarcode生成二维码的时候，发现无法显示 并且报错

原因分析：

使用element-ui Dialog弹出框 叠加 条形码二维码时无法获取当前元素节点

解决方案：

将生成的二维码单独写一个组件，然后再引入到Dialog 就可以了

<template>
  <div>
    <svg class="barcode" ></svg>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted, nextTick } from 'vue'
import JsBarcode from 'jsbarcode'

onMounted(() => {
  nextTick(() => {
    JsBarcode('.barcode', "Hi!");
  })
})


</script>