1.修改titleNView样式
可以globalStyle中配置,也可以在pages中配置。主要是tags的使用,官方给了个提示
具体使用如下:
"app-plus": {
"titleNView": {
"titleText": "",
"tags": [
{
"tag": "font",
"text": " 自定义导航栏文字样式",
"textStyles": {
"align": "left",
"color": "rgba(255, 0, 0, 0.5)",
"family": "Times New Roman",
"size": "24px",
"style": "normal",
"weight": "bold",
"overflow": "ellipsis"
}
}
]
}
}
2.各页面动态设置标题
titleNView的样式我是配置在globalStyle中,然后在各个页面分别修改标题文本。在utils中抽取方法,各页面分别调用即可。
/**
* 动态设置标题
* @param titleText
*/
const setTitle = (titleText) => {
// #ifdef APP-PLUS
let pages = getCurrentPages();
let page = pages[pages.length - 1];
let currentWebview = page.$getAppWebview();
// const currentWebview = this.$scope.$getAppWebview(); 可简化
let title = currentWebview.getStyle().titleNView;
title.tags[0].text = titleText || '';
currentWebview.setStyle({
titleNView: title
});
// #endif
}
onLoad (options) {
setTitle('动态标题')
},