iconify图标

在框架中，图标有2种类型：iconify和本地图标。

iconify图标官网：Iconify - home of open source icons

iconify图标是一种在线图标库，提供了大量的图标资源，用户可以通过简单的代码在网页中使用这些图标。

在Vue中使用

<template>
  <div>
    <iconify-icon :icon="homeIcon" width="24" height="24"></iconify-icon>
  </div>
</template>

<script>
import { defineComponent } from 'vue';
import IconifyIcon from '@iconify/vue';
import homeIcon from '@iconify/icons-mdi/home';

export default defineComponent({
  components: {
    IconifyIcon
  },
  setup() {
    return {
      homeIcon
    };
  }
});
</script>

使用步骤总结

1. 引入iconify资源：可以通过CDN引入CSS或JavaScript文件。

2. 选择图标：在iconify的图标库中选择需要的图标，图标名称通常以集合名:图标名的形式表示，例如mdi:home。

3. 在代码中使用图标：根据使用的框架或语言，通过相应的语法将图标嵌入到页面中。