uview u-icon图标显示方框 或 图标不显示

1. 先检查自己的项目中是否存在指定字体类型的地方

我这里是在全局指定了字体类型，导致覆盖了uview的字体

?

1 2 3

*{     font-family: PingFangSC, PingFang SC; }

把它注释掉就能解决图标显示方框的问题。
至于这个注释掉的字体，就只能换种方法配置了，不要影响到uview的图标字体就行。

2. 如果不是上述问题，那就到u-icon.vue中把字体下载下来转换成Base64格式

（1）找到路径下uview-ui/components/u-icon/u-icon.vue文件，找到下面这段代码

?

1 2 3 4

@font-face {         font-family: 'uicon-iconfont';         src: url('https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf') format('truetype'); }

（2）把这个字体 https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf 下载下来

（3）利用这个网站 https://transfonter.org/ 把这个字体转成Base64

 （4）将转换成功的文件下载下来并解压，然后复制stylesheet.css里url内的内容。到（1）的同一位置，把字体链接的内容替换掉。
解压后的文件列表：

stylesheet.css要复制的内容：（内容很长）

替换之后：

 （5）保存并重启项目即可。