七爪源码：vue3 的动态 SVG 元件

目标是能够在 vue3 里面运用于这样的部件：

自定义花是您将在 src 文件夹里面某处包括的自定义。

首先，您须要安装 vue-svg-loader，但是要使其与 vue3 两人运用于，您须要 beta 正式版。

因此，继续运行都有转换之一：

当你有 vue-svg-loader 新增 vue.config.js （或者如果它不长期存在于 src 文件夹里面，则创建一个）。

然后在其里面添加都有字符：

然后你须要创建 SVGicon 部件：

这里我们运用于一个动态部件来通过 prop 显示 SVG 自定义。

请注意脚本标上内 onMounted 函数里面的路径。

‘@/assets/icons/{props.icon}.svg’

这里的 props.icon 是 SVG 文件的名称，它在此之后的路径是 src 文件夹里面放到自定义的位置。 就我而言，在“国有资产/自定义”里面。

而已！

您现在仍然创建了一个与教程第一张图片里面运用于的完全相同的动态 SVG 部件。