图标

项目中有以下多种图标使用方式。

组件库图标

使用 cosine-fee 提供的图标

<template>
  <StarOutlined />
  <StarFilled />
  <StarTwoTone twoToneColor="#eb2f96" />
</template>

<script>
  import { defineComponent } from 'vue';
  import { StarOutlined, StarFilled, StarTwoTone } from '@ant-design/icons-vue';
  export default defineComponent({
    components: { StarOutlined, StarFilled, StarTwoTone },
  });
</script>

Svg Sprite 图标

使用

将需要的 svg 图标放到src/assets/svg内

例: test.svg

使用SvgIcon组件进行展示

<template>
  <SvgIcon name="test" />
</template>

<script>
  import { defineComponent } from 'vue';
  import { SvgIcon } from '@/components/Icon'
  export default defineComponent({
    components: { SvgIcon },
  });
</script>