vue3在zrender中怎么通过antd的icon的name引入图片

在Vue3中使用zrender来引入antd的icon图片，可以通过以下步骤实现：

1. 安装@ant-design/icons-vue插件，该插件可以提供antd的所有icon组件。

2. 在Vue3组件中引入@ant-design/icons-vue插件，并且设置对应的icon组件。

3. 在zrender中，通过引入antd的icon组件，来获取对应的icon图片。

以下是示例代码：

<template>
  <div class="zrender-container"></div>
</template>

<script>
import { defineComponent, onMounted, ref } from 'vue'
import { Icon } from '@ant-design/icons-vue'
import { init } from 'zrender'

export default defineComponent({
  name: 'ZrenderContainer',
  setup() {
    const zr = ref(null)

    onMounted(() => {
      const container = document.querySelector('.zrender-container')
      const zrInstance = init(container)

      // 获取antd的icon图片
      const iconComponent = Icon.createFromIconfontCN({
        scriptUrl: '//at.alicdn.com/t/font_1234567_abcd1234.js' // 你的iconfont脚本地址
      })
      const iconImageUrl = iconComponent.iconConfig.url

      // 在zrender中使用icon图片
      zrInstance.add(new zrender.Image({
        style: {
          image: iconImageUrl,
          x: 100,
          y: 100,
          width: 50,
          height: 50
        }
      }))

      zr.value = zrInstance
    })

    return {
      zr
    }
  }
})
</script>

<style>
.zrender-container {
  width: 500px;
  height: 500px;
}
</style>

需要注意的是，iconfont脚本地址需要替换成你自己的地址。另外，如果需要使用不同的icon，只需要更换Icon.createFromIconfontCN()中的scriptUrl即可。