uniapp中动态修改原生titleNview

如何在uniapp中修改原生导航栏?

第一步,先获取当前页面的webview:

var pages = getCurrentPages();
var page = pages[pages.length - 1];
var currentWebview = page.$getAppWebview();

第二步,获取当前webview的titleNview

var tn = currentWebview.getStyle().titleNView;

打印tn 得到如下效果:

{
    "autoBackButton": true,
    "backgroundColor": "#F8F8F8",
    "buttons": [{
        "text": "不使用",
        "type": "none",
        "color": "#333",
        "background": "#fff",
        "fontSize": "16px",
        "fontWeight": "bold",
        "width": "80px"
    }],
    "dock": "top",
    "height": 44,
    "position": "dock",
    "statusbar": {},
    "tags": [],
    "titleColor": "#000000",
    "titleText": "优惠券",
    "type": "default"
}

第三步,动态设置其中参数:

tn.buttons[0].text = '动态按钮名字';

第四步,更新webview的原生导航栏:

currentWebview.setStyle({
    titleNView: tn
});

你可能感兴趣的:(uni-app)