ionic4自定义图标
2019-07-19 本文已影响6人
IT晴天
ionic4的自定义图标使用方式与ionic3很大不同
当前ionic4我只会一种使用方式,其它的还没空研究,操作上很简单:
1. 下载svg文件放在项目目录下,如assets/fonts
下面,并改为ios/md
前缀:
![](https://img.haomeiwen.com/i7275341/1e080a8d36655096.png)
2. 打开angular.json
文件,找到下面内容,然后添加红框内容(指向上面步骤路径):
![](https://img.haomeiwen.com/i7275341/a428acfd2771eea5.png)
然后大功告成,使用如下:
<ion-icon name="qianshou" color="primary"></ion-icon>
额外话
其实,图标的下载习惯了这样的方式:
![](https://img.haomeiwen.com/i7275341/06d0b05c41310e5b.png)
然而我也不知道如何能无缝地集成到ionic原有的组件中。所以这种方式,要么老实用<i class="iconfont icon">
方式,要么基于此封装成自定义图标组件,如有更好的方式,欢迎留言👏。