Uniapp更改图标的方法:首先,将图标文件中的“iconfont.ttf”放入静态文件夹;然后打开“iconfont.css”,查看unicode编码;最后,在配置项“page.json”中填写对应图标的代码。

本教程操作环境:Windows7系统,uni-app版本2.5.1,此方法适用于所有品牌的电脑。

推荐(免费):统一应用开发教程

统一应用添加顶部导航栏并更改图标

Uni-app是一个使用Vue.js开发跨平台应用的前端框架

开发者通过编写Vue.js代码,将其编译到iOS、Android、微信小程序等平台,保证其正确运行,体验极佳。

记录更换顶部导航栏的过程

最终效果图

page.json中的配置项

{ & quot路径& quot:& quot页面/我的/索引& quot,& quot样式& quot:{ & quotapp-plus & quot;:{ & quot标题视图& quot:{ & quot按钮& quot:

收藏夹图标

2.下载右上角收集的所有图标

下载

3.在编辑器中打开下载的文件,将文件中的iconfont.ttf扔到静态文件夹中,然后打开iconfont.css查看unicode编码

Unicode编码

4.最后,在page.json的配置项中填写对应图标的代码,需要写成“\ u * * * & quot,然后重新启动它

5.最后填写相应的页面生命周期方法,通过e.index配置不同的方法

onnavigationbuttontap:function(e){ console . log(JSON . stringify(e))},以上是uniapp如何更改图标的细节,还有更多。

Logo

前往低代码交流专区

更多推荐