uni-app实现导航栏自定义图标

效果

代码

fontSrc中的字体文件可以到阿里巴巴iconfont中获取。在onNavigationBarButtonTap钩子函数中可以监听到按钮的点击。

pages.json中

	{
			"path": "pages/rent/order/list/index",
			"style": {
				"navigationBarTitleText": "订单列表",
				"enablePullDownRefresh": true,
				"app-plus":{
					"titleNView":{
						"buttons":[
							{
								"text":"\ue720",
								"fontSrc":"/static/iconfont/search/iconfont.ttf",
								"fontSize":"21px"
							}
						]
					}
				}
			}
		},

获取字体图

将ttf文件放到你的项目中，在iconfont.css文件中可以查看对应的字符，注意在uni-app中使用时必须添加 ‘\u’ 开头