Vue3 组件中引入svg，导入canvas中

Vue3 中引入svg，将引入的组件赋给canvas中

并不需要太多的配置，只需要在需要的组件中导入

import svg from '@/assets/img/svg/icon.svg

let svgIcon = new Image()

svgIcon.src = svg

// 画图中
let p1 = new Promise((resolve, reject) => {
    return (svgIcon.onload = function () {
      resolve()
    })
})

Promise.all([p1]).then(res => {
    // 执行画图的逻辑
    draw()
})

const draw = () => {
    const canvas = document.getElementById('canvas')
    const ctx = canvas.getContext('2d')
    ctx.drawImage(svgIcon, dx, dy , dWidth, dHeight)
}