uni-app 頂部導航點擊更換圖標

更換頂部導航的iconfont.ttf圖標，先在配置文件配置好按鈕：

pages.json文件

"buttons": [
{
"text": "\ue63d",
"fontSrc": "/static/iconfont.ttf",
"fontSize": "22px",
"color":"#fc455d",
"float":"left"
}
]

然后在當前的vue頁面的生命周期里面獲取到當前點擊的按鈕，把text里面的圖標代碼更改掉就可以了：

生命周期：

onNavigationBarButtonTap:function(btn){
if(btn.index == 0){
let pages = getCurrentPages();
let page = pages[pages.length - 1];
// #ifdef APP-PLUS
let currentWebview = page.$getAppWebview();
let titleObj = currentWebview.getStyle().titleNView;
console.log(1);
console.log(JSON.stringify(titleObj.buttons[0]));
if (!titleObj.buttons) {
return;
}
if(titleObj.buttons[0].text == '\ue63d'){
titleObj.buttons[0].text = "\ue602";
}else{
titleObj.buttons[0].text = "\ue63d";
}
currentWebview.setStyle({
titleNView: titleObj
});
// #endif
}

}

 別忘了用// #endif 把判斷結束

源碼已全部貼出！！！