uni-app开发app自定义导航栏之添加自定义按钮之使用字体图标的坑

592 阅读1分钟

在uni-app导航栏开发中,如何使用图片按钮,最终总结使用图片类按钮的几个步骤。

首先,我们先来看下官方对于自定义导航按钮的配置表格

image.png

然后,字体图标我一般是使用的是阿里的图标库iconfont,怎么下载使用,这边就不说了

image.png

进入项目,下载字体包,将iconfont.ttf的字体包放入uniapp下的static文件夹下。

在需要自定义导航按钮的页面(eg:index页面)做如下配置:

image.png

图一说到text的Unicode必须使用\u开头,因此iconfont的Unicode的&#x必须转为\u。否则该图片在h5调试上可以显示,但是在app编译中却无法显示,之前就是吃了这个亏.

踩坑完毕!