欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

uni-app動(dòng)態(tài)修改導(dǎo)航欄標(biāo)題簡單步驟

 更新時(shí)間:2023年06月12日 14:30:47   作者:Ciao_Traveler  
uniapp作為一款開源軟件,可以做到一端多用,不過也有局限,在開發(fā)中有時(shí)候需要?jiǎng)討B(tài)的去修改標(biāo)題,下面這篇文章主要給大家介紹了關(guān)于uni-app動(dòng)態(tài)修改導(dǎo)航欄標(biāo)題的相關(guān)資料,需要的朋友可以參考下

對導(dǎo)航欄標(biāo)題進(jìn)行修改,直接使用就可以

uni.setNavigationBarTitle({
    title: "標(biāo)題名稱"
});

動(dòng)態(tài)修改標(biāo)題名稱,數(shù)據(jù)可能是從上一個(gè)頁面?zhèn)鬟f過來的,直接在onLoad頁面周期函數(shù)中使用

onLoad(props) {
	console.log(props,"onLoad");//獲取上一個(gè)頁面?zhèn)鬟f的數(shù)據(jù)
	if (props?.title) {
        const titleType = props.title;
        let barTitle = "預(yù)約會(huì)議";
        switch (titleType) {
          case "order":
            barTitle = '預(yù)約會(huì)議';
            break;
          case "create":
            barTitle = '創(chuàng)建會(huì)議';
            break;
          case "edit":
            barTitle = '編輯會(huì)議';
            break;
          default:
            break;
        }
        uni.setNavigationBarTitle({
        	title: barTitle
      	});
   	}
}

??可能會(huì)出現(xiàn)在網(wǎng)頁中切換標(biāo)題正常,但是在真機(jī)中沒有效果,通過查看官網(wǎng)看到這么一句話

如果需要在頁面進(jìn)入時(shí)設(shè)置標(biāo)題,可以在onReady內(nèi)執(zhí)行,以避免被框架內(nèi)的修改所覆蓋。如果必須onShow內(nèi)執(zhí)行需要延遲一小段時(shí)間
打印頁面生命周期發(fā)現(xiàn)onLoad先于onReady執(zhí)行,所以即使數(shù)據(jù)是上一個(gè)頁面?zhèn)鬟f過來的,也不會(huì)影響標(biāo)題的展示。
第一步,我們可以在data中定義一個(gè)變量headerTitle

data(){
	return {
		headerTitle:"",//導(dǎo)航欄的標(biāo)題
	}
}

第二步,在onLoad頁面周期中去獲取上一個(gè)頁面?zhèn)鬟f的參數(shù),然后對headerTitle進(jìn)行賦值,方便我們接下來的使用

onLoad(props) {
	console.log(props,"onLoad");//獲取上一個(gè)頁面?zhèn)鬟f的數(shù)據(jù)
	if (props?.title) {
        const titleType = props.title;
        let barTitle = "預(yù)約會(huì)議";
        switch (titleType) {
          case "order":
            barTitle = '預(yù)約會(huì)議';
            break;
          case "create":
            barTitle = '創(chuàng)建會(huì)議';
            break;
          case "edit":
            barTitle = '編輯會(huì)議';
            break;
          default:
            break;
        }
       this.headerTitle=barTitle
   	}
}

最后,需要在onReady中進(jìn)行設(shè)置標(biāo)題,??onReady中沒有接收的參數(shù)

onReady(){
	 uni.setNavigationBarTitle({
        title: this.headerTitle
     });
}

通過借助兩個(gè)頁面周期函數(shù),可以實(shí)現(xiàn)動(dòng)態(tài)修改導(dǎo)航欄標(biāo)題

上一個(gè)頁面?zhèn)鬟f的參數(shù)

const type = 'create';//傳遞給下一個(gè)頁面的參數(shù)
uni.navigateTo({
   url: `/pages/bookAMeeting/index?title=${type}`
})

總結(jié)

到此這篇關(guān)于uni-app動(dòng)態(tài)修改導(dǎo)航欄標(biāo)題的文章就介紹到這了,更多相關(guān)uni-app動(dòng)態(tài)修改導(dǎo)航欄標(biāo)題內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論