最新的ElementPlus图标使用动态组件方式渲染失败

Question

ElementPlus图标自动导入文档 版本号：2.2.19

按照步骤操作完之后，直接使用图标是可以的

<i-ep-setting class="icon" />
<!--
渲染出了 SVG 图标
-->

但是换成动态组件就不行了

<component class="icon" :is="iconName" />
<!-- 渲染结果为空白，内容如下：
<i-ep-setting class="icon" data-v-02d3e8fd=""></i-ep-setting> 
-->

渲染出来的结果如下

请问这个有什么解决办法吗？

Answer 1

Sunday 2022-11-09 11:48:46

你好

这个可以把你的代码给我发一下，我看看这种情况使用动态组件怎么处理。（QQ 群中联系：LGD_Sunday）发送项目压缩包（去除 node_Modules）或者 git 地址均可

• 提问者 sunzhenyang #1

  仓库地址：https://github.com/sunzhenyang/vite-vue-element-admin
  文件路径：src/layout/components/Sidebar/MenuItem.vue

• Sunday 回复 提问者 sunzhenyang #2

  你好，在你的代码中 i-ep-setting 并不是一个被注册的组件，而是一个通过 unplugin-auto-import 插件被自动导入的组件。而对于  component 动态组件而言，他只能渲染被注册的（在 app._context.components 中可以查询到的）组件，所以  i-ep-setting 无法通过动态组件的形式被渲染。