uview 自定义图标 u-icon

uview 使用自定义图标
https://blog.csdn.net/VOID_Pointer_G/article/details/109574455
操作

  1. 下载svg格式的文件(如果是png等图片,先将图片转svg)
  2. 上传svg文件到阿里字体图标库
    uview 自定义图标 u-icon

设置name
uview 自定义图标 u-icon
在右上角的”更多操作”中,进入”编辑项目” 修改”FontClass/Symbol 前缀”项为”custom-icon-“,修改”Font Family”为”custom-icon”
3. 下载解压缩,修改 iconfont.css 文件
只保留一行
uview 自定义图标 u-icon
结尾改;
uview 自定义图标 u-icon

  1. 项目app.vue中引入文件
    uview 自定义图标 u-icon

  2. 图标库使用

通过custom-prefix指定类名为custom-icon

报错:文件查找失败:'./iconfont.ttf?t=1605488148927
https://segmentfault.com/q/1010000011515178
调整iconfont.css路径
uview 自定义图标 u-icon
uview 自定义图标 u-icon

或者使用cdn
uview 自定义图标 u-icon

不报错,图标无法显示:
https://www.bookstack.cn/read/uview-1.2.7/cf9ae06873f36264.md
查看iconfont.css
uview 自定义图标 u-icon

检查这部分与u-icon name是否一致

上一篇:How to add custom action button - --ng2-smart-table


下一篇:fastadmin 关于selectpage查询及二级联动