使用Vuetify创建自定义图标

Question

我正在尝试使用Vuetify v-icon创建自定义图标： 我遵循文档，但对我不起作用。

1. 我用svg代码创建一个组件： HomeIcon.vue

2. vuetify.js看起来像这样：

3）现在我正在尝试在组件中使用它：

1. 但是结果是：

Answer 1

我认为，如果您更改vuetify.js文件中的代码，它应该可以正常工作。 另一个技巧是，如果主题明确，总是在主题后添加图标。

将代码更改为此：

import icon from "icon.vue";
export default new Vuetify({
   theme,
   icons: {
     values: {
        icon: {
         component: icon,
         },
      },
     },
   });

您也可以通过执行$ icon而不是$ vuetify.icons.icon来创建快捷方式。