uniapp頁(yè)面跳轉(zhuǎn)的五種方式總結(jié)
uniapp頁(yè)面跳轉(zhuǎn)的幾種方式
一、uni.navigateTo
定義:保留當(dāng)前頁(yè)面,跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面,使用uni.navigateBack可以返回到原頁(yè)面。
使用:
// 1.不傳參 uni.navigateTo({ url:'./home/index' }); // 2.傳參字符串 uni.navigateTo({ url:`./home/index?title=${title}` }); // 3.傳參對(duì)象 // 傳入 let data = { title:'hello', id: 1 } uni.navigateTo({ url:`./home/index?data=`+ encodeURIComponent(JSON.stringify(data)) }) // 接受參數(shù) onLoad: function (option) { const item = JSON.parse(decodeURIComponent(option.item)); }
二、uni.redirectTo
定義:可以關(guān)閉當(dāng)前界面并跳轉(zhuǎn)到其他的非tabbar界面(可帶參數(shù))
使用:
uni.redirectTo({ url:'./home/index' });
三、uni.reLaunch
定義:關(guān)閉所有頁(yè)面,打開(kāi)到應(yīng)用內(nèi)的某個(gè)頁(yè)面(可帶參數(shù))
使用:
uni.reLaunch({ url:'./home/index' });
四、uni.switchTab
定義:跳轉(zhuǎn)到 tabBar 頁(yè)面,并關(guān)閉其他所有非 tabBar 頁(yè)面
使用:
uni.switchTab({ url:'./home/index' });
五、uni.navigateBack
定義:關(guān)閉當(dāng)前頁(yè)面,返回上一頁(yè)面或多級(jí)頁(yè)面
使用:
uni.navigateBack({ url:'./home/index' }); uni.navigateBack({ delta: 2 });
總結(jié)
- navigateTo, redirectTo 只能打開(kāi)非 Tab 頁(yè)面,可傳參。
- switchTab 只能打開(kāi) Tab 頁(yè)面,不可傳參。
- reLaunch 可以打開(kāi)任意頁(yè)面,可傳參。
到此這篇關(guān)于uniapp頁(yè)面跳轉(zhuǎn)的五種方式的文章就介紹到這了,更多相關(guān)uniapp頁(yè)面跳轉(zhuǎn)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript如何判斷一個(gè)對(duì)象是空對(duì)象(附5種常見(jiàn)方法)
在JavaScript中判斷對(duì)象的類型是開(kāi)發(fā)過(guò)程中的一個(gè)常見(jiàn)需求,尤其是在處理不確定類型的數(shù)據(jù)時(shí),這篇文章主要介紹了JavaScript如何判斷一個(gè)對(duì)象是空對(duì)象的相關(guān)資料,需要的朋友可以參考下2025-04-04優(yōu)化innerHTML操作(提高代碼執(zhí)行效率)
多數(shù)現(xiàn)代瀏覽器都實(shí)現(xiàn)了innerHTML操作,它的方便性讓我們愛(ài)不釋手,但如果使用不當(dāng),很容易出現(xiàn)效率問(wèn)題,本文通過(guò)一個(gè)例子來(lái)說(shuō)明如何優(yōu)化innerHTML操作。2011-08-08實(shí)例解析package.json和最常見(jiàn)的scripts字段
日常開(kāi)發(fā)中,現(xiàn)在的前端開(kāi)發(fā)已經(jīng)被三大框架取代,其中最主流的不過(guò)vue和react,而開(kāi)發(fā)這些項(xiàng)目的時(shí)候不得不接觸package.json這個(gè)文件,可你真的了解這個(gè)文件嗎?今天給大家聊聊package.json和最常見(jiàn)的scripts字段,感興趣的朋友一起看看吧2023-04-04前端如何用post的方式進(jìn)行eventSource請(qǐng)求
這篇文章主要給大家介紹了關(guān)于前端如何用post的方式進(jìn)行eventSource請(qǐng)求的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2023-04-04JS數(shù)組去掉重復(fù)數(shù)據(jù)只保留一條的實(shí)現(xiàn)代碼
這篇文章主要介紹了JS數(shù)組去掉重復(fù)數(shù)據(jù)只保留一條的實(shí)現(xiàn)代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-08-08js實(shí)現(xiàn)點(diǎn)擊切換checkbox背景圖片的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇js實(shí)現(xiàn)點(diǎn)擊切換checkbox背景圖片的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-05-05JS關(guān)于?replace?取值、替換第幾個(gè)匹配項(xiàng)問(wèn)題小結(jié)
這篇文章主要介紹了JS關(guān)于replace取值、替換第幾個(gè)匹配項(xiàng),本文針對(duì)字符串的替換、截取知識(shí)點(diǎn)做詳細(xì)介紹,結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),需要的朋友可以參考下2023-05-05