1.wx.navigateTo(OBJECT)

? ?需要跳轉(zhuǎn)的應(yīng)用內(nèi)非 tabBar 的頁面的路徑 , 路徑后可以帶參數(shù)。參數(shù)與路徑之間使用?分隔，參數(shù)鍵與參數(shù)值用=相連，不同參數(shù)用&分隔；如 ‘path?key=value&key2=value2’。

wx.navigateTo({url: 'test?id=1' })

? ?這種跳轉(zhuǎn)方式默認(rèn)有返回按鈕，返回到上一個(gè)頁面。

2.wx.redirectTo(OBJECT)

? ?需要跳轉(zhuǎn)的應(yīng)用內(nèi)非 tabBar 的頁面的路徑，路徑后可以帶參數(shù)。參數(shù)與路徑之間使用?分隔，參數(shù)鍵與參數(shù)值用=相連，不同參數(shù)用&分隔；如 ‘path?key=value&key2=value2’。

wx.redirectTo({url: 'test?id=1' })

? ?這種跳轉(zhuǎn)方式默認(rèn)有返回按鈕，返回到上一個(gè)頁面的再上一層。

3.wx.reLaunch(OBJECT)

? ?需要跳轉(zhuǎn)的應(yīng)用內(nèi)頁面路徑 , 路徑后可以帶參數(shù)。參數(shù)與路徑之間使用?分隔，參數(shù)鍵與參數(shù)值用=相連，不同參數(shù)用&分隔；如 ‘path?key=value&key2=value2’，如果跳轉(zhuǎn)的頁面路徑是 tabBar 頁面則不能帶參數(shù)。

wx.reLaunch({url: 'test?id=1' })

? ? 這種跳轉(zhuǎn)方式默認(rèn)沒有返回按鈕，不需要默認(rèn)返回按鈕的頁面就可以使用這個(gè)api了。

4.wx.switchTab(OBJECT)

? ?需要跳轉(zhuǎn)的 tabBar 頁面的路徑（需在 app.json 的 tabBar 字段定義的頁面），路徑后不能帶參數(shù)。

{"tabBar": {"list": [{"pagePath": "index","text": "首頁"},{"pagePath": "other","text": "其他"}]} } wx.switchTab({url: '/index' })

? ? 我們需要調(diào)轉(zhuǎn)到tabbar定義的頁面的時(shí)候，就需要這個(gè)api了。踩過這個(gè)坑的人就知道，除了這個(gè)api，其他的都不能跳轉(zhuǎn)到tabar定義過的頁面

5.wx.navigateBack(OBJECT)

? ?delta Number 1 返回的頁面數(shù)，如果 delta 大于現(xiàn)有頁面數(shù)，則返回到首頁。

// 此處是A頁面 wx.navigateTo({url: 'B?id=1' }) // 此處是B頁面 wx.navigateTo({url: 'C?id=1' }) // 在C頁面內(nèi) navigateBack，將返回A頁面 wx.navigateBack({delta: 2 })

6.navigator 組件使用跳轉(zhuǎn)

/** wxss **/ /** 修改默認(rèn)的navigator點(diǎn)擊態(tài) **/ .navigator-hover {color:blue; } /** 自定義其他點(diǎn)擊態(tài)樣式類 **/ .other-navigator-hover {color:red; } <!-- sample.wxml --> <view class="btn-area"><navigator url="/page/navigate/navigate?title=navigate" hover-class="navigator-hover">跳轉(zhuǎn)到新頁面</navigator><navigator url="../../redirect/redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">在當(dāng)前頁打開</navigator><navigator url="/page/index/index" open-type="switchTab" hover-class="other-navigator-hover">切換 Tab</navigator><navigator target="miniProgram" open-type="navigate" app-id="" path="" extra-data="" version="release">打開綁定的小程序</navigator> </view> <!-- navigator.wxml --> <view style="text-align:center"> {{title}} </view> <view> 點(diǎn)擊左上角返回回到之前頁面 </view> <!-- redirect.wxml --> <view style="text-align:center"> {{title}} </view> <view> 點(diǎn)擊左上角返回回到上級(jí)頁面 </view>

總結(jié)

以上是生活随笔為你收集整理的微信小程序页面跳转的6种方式和区别的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。