WakeAdmin 后台框架Appearance
惟客云图标库
安装和使用
$ pnpm add @wakeadmin/icons
INFO
@wakeadmin/icons 兼容 vue2/3
使用:
<template>
<div><DeleteBin /></div>
</template>
<script setup>
import { DeleteBin } from '@wakeadmin/icons';
</script>
图标组件的渲染结果就是 <svg>, 你可以使用 CSS 进行控制:
<template>
<div><DeleteBin class="my-icon" /></div>
</template>
<script setup>
import { DeleteBin } from '@wakeadmin/icons';
</script>
<style>
.my-icon {
fill: green;
width: 32px;
height: 32px;
}
</style>
配合 ElIcon 使用, 和 element-plus 的图标用法完全一样:
<ElIcon color="green"><DeleteBin /></ElIcon>
在微前端基座及其子应用中，可以通过 <wkc-icon> 来渲染图标，不需要额外导入：
<div><wkc-icon icon="Add" /></div>
图标索引
点击图标进行拷贝。