elementui ico
ElementUI 图标使用指南
ElementUI 默认使用 字体图标（通过 el-icon-xxx 类名），但在新版本中也支持了 SVG 图标（通过 <el-icon> 组件）。以下是两种方式的具体使用方法：
字体图标（传统方式）
在 ElementUI 中，字体图标通过类名调用，例如 el-icon-edit。使用时需在 i 标签或按钮等组件中添加对应的类名。
<i class="el-icon-edit"></i>
<el-button icon="el-icon-search">搜索</el-button>SVG 图标（推荐方式）
ElementUI 从 2.0 版本开始支持 SVG 图标，需单独引入 @element-plus/icons（Element Plus）或使用内置的 SVG 图标组件。
<template>
<el-icon><Edit /></el-icon>
<el-button :icon="Search" />
</template>
<script>
import { Edit, Search } from '@element-plus/icons'
export default {
components: { Edit, Search }
}
</script>自定义图标
如需使用第三方图标库（如 Font Awesome 或自定义 SVG），可通过以下方式集成：
-
覆盖默认图标
通过修改el-icon的 CSS 或替换组件实现。 -
直接引入第三方库
例如使用 Font Awesome：
<i class="fas fa-user"></i>图标集合查询
ElementUI 提供的完整图标列表可参考官方文档：
注意事项
- 字体图标需引入 ElementUI 的 CSS 文件。
- SVG 图标需单独安装依赖（如
@element-plus/icons）。 - 图标类名需严格匹配，大小写敏感。
