小程序跳轉(zhuǎn)頁面的方法以及傳參

其實(shí)在網(wǎng)上也看到很多人發(fā)的帖子,有的寫得很詳細(xì)了,但是自己還想總結(jié)一下我認(rèn)識的跳轉(zhuǎn):

我們很常用的頁面中寫url的就是

1、navigator? 關(guān)于它官方文檔給了很詳細(xì)的說明,我們也可以去參考一下官方的文檔:https://developers.weixin.qq.com/miniprogram/dev/component/navigator.html

<navigatorurl="/page/navigate/navigate?title=navigate"hover-class="navigator-hover">跳轉(zhuǎn)到新頁面</navigator><navigatorurl="../../redirect/redirect/redirect?title=redirect"open-type="redirect"hover-class="other-navigator-hover">在當(dāng)前頁打開</navigator><navigatorurl="/page/index/index"open-type="switchTab"hover-class="other-navigator-hover">切換 Tab</navigator><navigatortarget="miniProgram"open-type="navigate"app-id=""path=""extra-data=""version="release">打開綁定的小程序</navigator>

我們常用的可能也就是上面的這幾種方式,加一個點(diǎn)擊時候觸發(fā)的樣式

.navigator-hover{color:blue;}

2、wx.redirectTo

關(guān)閉當(dāng)前頁面,跳轉(zhuǎn)到應(yīng)用內(nèi)的某個頁面。但是不允許跳轉(zhuǎn)到 tabbar 頁面。

其它的不多說,重點(diǎn)都在粗體,我曾經(jīng)因?yàn)閷懥诉@個不跳轉(zhuǎn),糾結(jié)了一個多小時,最后才出坑

3、wx.navigateTo

頁面中大部分的跳轉(zhuǎn)我都用了這個,但是后來發(fā)現(xiàn),根據(jù)項(xiàng)目的不同需求,這個跳轉(zhuǎn)方式也是有局限性的。

保留當(dāng)前頁面,跳轉(zhuǎn)到應(yīng)用內(nèi)的某個頁面。但是不能跳到 tabbar 頁面。使用?wx.navigateBack?可以返回到原頁面。小程序中頁面棧最多十層。

這個里面我想說的是注意刷新問題,返回上一頁只是返回上一頁,上一頁如果在棧中,注意需不需要刷新

4、wx.switchTab

跳轉(zhuǎn)到 tabBar 頁面,并關(guān)閉其他所有非 tabBar 頁面

5、wx.reLaunch

關(guān)閉所有頁面,打開到應(yīng)用內(nèi)的某個頁面


說一下除了第一種其他頁面跟參數(shù)的問題

wx.navigateTo({

? ? ? url: '../../pages/detail/index?id=' + e.currentTarget.dataset.id

? ? })

跳轉(zhuǎn)到的頁面獲取參數(shù),此處需要注意,接收參數(shù)是在小程序生命周期的onLoad函數(shù)中接收數(shù)據(jù)

onLoad: function (options) {

? ? var itemid=options.id;

? ? ?console.log(itemid);//打印接受的值

}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容