首頁 > web前端 > uni-app > uniapp如何設定導覽列隱藏顯示

uniapp如何設定導覽列隱藏顯示

藏色散人
發布: 2020-12-22 17:26:34
原創
11451 人瀏覽過

uniapp設定導覽列隱藏顯示的方法:先取得目前頁面webview的物件實例;然後列印,並找到需要修改的資料;接著修改「titleNView.autoBackButton=false」;最後最後重設titleNView即可。

uniapp如何設定導覽列隱藏顯示

本教學操作環境:windows7系統、uni-app2.5.1版本,此方法適用於所有品牌電腦。

推薦(免費):uni-app開發教學

uniapp動態顯示/隱藏頂部導覽列返回按鈕

uniapp動態修改頂部導覽列

取得目前頁面webview 的物件實例

let pages = getCurrentPages()
let page = pages[pages.length - 1];
let currentWebview = page.$getAppWebview();
登入後複製

列印,找到需要修改的資料

let titleNView = currentWebview.getStyle().titleNView
console.log(titleNView)
//打印结果
{
"autoBackButton": true,
"backgroundColor": "#F8F8F8",
"dock": "top",
"height": 44,
"position": "dock",
"statusbar": {},
"tags": [],
"titleColor": "#000000",
"titleText": "纸板入库",
"type": "default"
}
登入後複製

然後修改

titleNView.autoBackButton = false
登入後複製

最後重設titleNView

currentWebview.setStyle({
titleNView:titleNView
})
登入後複製

如果是修改導覽列標題的話不需要以上程式碼,直接呼叫uni.setNavigationBarTitle()即可。如下

uni.setNavigationBarTitle({
   title: '新的标题'
});
登入後複製

以上是uniapp如何設定導覽列隱藏顯示的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板