uniapp导航栏配置自定义按钮
{
"path" : "pages/weshare/ws-index/ws-index",
"style" : {
"navigationBarTitleText": "微享WeShare",
"enablePullDownRefresh":true,
"app-plus": {
"titleNView": {
"buttons": [
{
"color":"#fff",
"float":"right",
"fontSize":"32px",
"type": "menu",
"signType": "menuBtn"
},
{
"color":"#fff",
"float":"right",
"fontSize":"20px",
"fontSrc":"/static/iconfont/iconfont.ttf", //此处有说明,见下方
"text": "\ue672", //自定义按钮
"signType": "homeBtn"
}
]
}
}
}
},
关于iconfont.ttf文件的引用及说明
unicode形式的使用说明:
如上图,将 替换为 \u 即可。如 -> \ue737
unicode不生效的说明:
若新增了icon图库,并更新了iconfont.css和iconfont.ttf文件,则需要重新运行app基座才行,否则不生效。
关于导航栏自定义按钮点击事件的监听
监听按钮、输入框事件,uni-app给出了相应API,只需把onNavigationBarButtonTap和onNavigationBarSearchInputChanged,写在响应的页面中即可
//监听原生导航栏按钮点击事件
onNavigationBarButtonTap(e){
console.log(e)
},