uni 加入图标_uniapp如何更改图标

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如何更改图标的细节，还有更多。