5.0 KiB
5.0 KiB
::: anchor :::
::: title 基本介绍 :::
::: describe 语义化的矢量图形。 :::
::: title 基础使用 :::
::: demo 使用 color
属性设置颜色
:::
::: title 组件图标 :::
::: describe 使用图标组件,你需要安装 @layui/icons-vue
图标组件包。
:::
npm install @layui/icons-vue
::: describe 然后, 你可以像之前使用组件一样去创建图标。 :::
<template>
<AlignCenterIcon></AlignCenterIcon>
<DiamondIcon></DiamondIcon>
</template>
<script setup>
import { AlignCenterIcon, DiamondIcon } from '@layui/icons-vue';
</script>
::: title 图标列表 :::
::: demo
-
{{ layIcon.name }}&#x{{ iconsUnicode[index] }};{{ layIcon.class }}
:::
::: title 图标属性 :::
::: table
属性 | 描述 | 默认值 |
---|---|---|
type | 图标 | layui-icon-home |
prefix | 前缀 | layui-icon |
color | 颜色 | -- |
size | 尺寸 | -- |
:::
::: contributor icon :::
::: previousNext icon :::