Files
mes-ui-d2/static/markdownFiles/article/组件 - 图标组件 - svg.md
李杨 2cdb105e7b no message
Former-commit-id: a50511cb36f6ab3960e5a66b0fd3f952717bd030
Former-commit-id: 7852addc7f9d39775fee6494e7b2088cb84de5d2
Former-commit-id: e91aa14f694da2d585e26aed228d82fa4ab06798
2018-02-22 18:29:54 +08:00

34 lines
1.0 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

## 参数
| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
| --- | --- | --- | --- | --- | --- |
| name | 图标名称 | 非 | String | 放在 src/assets/icons/svg 中的 .svg 文件名 | 空 |
## 使用方法
首先将下载的 .svg 图标放入 `src/assets/icons/svg` 文件夹下
然后使用组件
```
<IconSvg name="刚才的svg文件名"></IconSvg>
```
## 获取已经注册的所有图标
你已经发现了,只需要将图标文件放入项目中就会自动注册
这是因为已经对 `webpack``svg-sprite-loader` 进行了相关设置,`src/assets/icons/svg` 文件夹中的图标会自动注册到项目中,文件全部打包成 svg-sprite名称注册到 `Vue.$IconSvg` 属性中
所以如果你需要检查项目中已经注册的所有图标,可以通过如下方式
```
// 在 vue 单文件组件中
console.log(this.$IconSvg)
```
## 参考
演示图标来源 [iconfont.cn @小啊小二饼 《2.5D工作日记》](http://iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=8219)