显示没有标签的Vuetify材质设计v-icon

Question

我有一堆HTML文本，在此文本中，我想使用“材质设计”图标。例如：

var htmlText = "<p>Hello world, have an icon: <v-icon small>mdi-alert</v-icon>.</p>

在模板中，我们将这样编码：

<div v-html="htmlText"/>

由于v-icon是vuetify标签，因此不会呈现，因此输出将是：

Hello world, have an icon: mdi-alert.

我认为可能的选择是使用Vue.compile（https://vuejs.org/v2/api/#Vue-compile）。但是，我没有一个字符串，而是一个包含很多html字符串的嵌套对象，因此这种方法有点麻烦（并且可能会导致性能问题？），尤其是因为我实际上需要呈现的唯一标签是{ {1}}。

由于我已经导入了Vuetify库，该库可能已在某个地方导入了MDI库，是否没有另一种方法来显示Material Design图标，而无需经过v-icon？

对此有什么好的解决方案？

Answer 1

使用Vuetify时，解决方案是使用以下格式：

Bob lives in a <span class="mdi mdi-home"></span>.

感谢MichalLevý指出正确的方向。