Vuetify 3：使用Svg作为v图标

iswrvxsc 于 2023-01-14 发布在 Vue.js

关注(0)|答案(1)|浏览(282)

我想使用我的自定义svg作为一个v图标，但我没有在Vuetify v3文档中找到任何解决方案。
在vuetify v2中，我可以在我的vuetify.js中做这样的事情：

export default new Vuetify({
  icons:{
    values: {
      test: { 
        component: Test,
      },

我可以这样使用它：

<v-icon size="40">$vuetify.icons.test</v-icon>

我怎样才能在Vuetify V3中做同样的事情？谢谢你的帮助：）

vue.js

来源：https://stackoverflow.com/questions/75097050/vuetify-3-use-svg-as-a-v-icon

1条答案

按热度按时间

pqwbnv8z1#

下面的代码显示了一个将自定义图标和mdi图标集添加到Vuetify并通过别名在组件中使用这两个图标的示例。

- 验证. js**

import { createVuetify } from 'vuetify'

import { aliases, mdi } from 'vuetify/iconsets/mdi-svg'

import folder from '@/customIcons/folderIcon.vue'
const aliasesCustom = {
  ...aliases,
  folder,
}

export const vuetify = createVuetify({
  icons: {
      defaultSet: 'mdi',
      aliases: {
        ...aliasesCustom
      },
      sets: {
        mdi,
      },
    },
})

- 文件夹Icon. vue（您的自定义图标）**

<template>
 <svg>...</svg>
</template>

- 任何证监会**

<template>
  <v-icon>$folder</v-icon>
  <v-icon>$mdiGithub</v-icon>
</template>

原始来源：Vuetify不和谐频道中的thread

赞(0）回复(0）举报 2023-01-14

我来回答

Vuetify 3：使用Svg作为v图标

1条答案

相关问题

热门标签

最新问答