open-index/open-npm huggingface dataset:
npm package: @junhe/common-icons
Description: 跨项目通用图标
Author: Billy Chen
Latest version: 1.3.0

# common-icons

一个动态显示 SVG 图标的 Vue 组件库。

## 用法

```html
<template>
  <div class="examples">
    <!-- 使用默认分类下的 'add' 图标, 并设置为绿色 -->
    <svg-icon name="add" :size="32" color="green" />

    <!-- 'Apple' 图标的颜色无法通过 color 属性更改，因为它本身包含颜色信息 -->
    <svg-icon category="Icons8" name="Apple" :size="32" />
  </div>
</template>

<script lang="ts">
import Vue from "vue";
import SvgIcon from "@junhe/common-icons";

export default Vue.extend({
  components: { SvgIcon },
});
</script>
```

## Props

| 属性名     | 类型                  | 含义                                                                                                 | 默认值           |
| ---------- | --------------------- | ---------------------------------------------------------------------------------------------------- | ---------------- |
| `name`     | `string`              | 要显示的图标名称。                                                                                   | **必填**         |
| `category` | `string`              | 图标的分类。                                                                                         | `'default'`      |
| `size`     | `string` \| `number`  | 图标的大小（像素）。                                                                                 | `16`             |
| `color`    | `string`              | 图标的填充颜色。 `'currentColor'` 是一个 CSS 关键字，它会使图标颜色继承其父元素的文本颜色 (`color` 属性)。 | `'currentColor'` |

## Demo

[点击跳转](http://220.168.85.72:10000/common-frontend/common-icons/#/)