微信小程序页面跳转三种方式
admin
2024-05-20 10:05:52

为了不让用户在使用小程序时造成困扰,微信小程序规定页面路径只能是五层,请尽量避免多层级的交互方式。
页面跳转的话就涉及到了多个页面层级

第一种:wx.navigateTo(OBJECT)
保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。

OBJECT参数说明:

参数 类型 必填 说明
url String 是 需要跳转的应用内页面的路径 , 路径后可以带参数。参数与路径之间使用?分隔,参数键与参数值用=相连,不同参数用&分隔;如 ‘path?key=value&key2=value2’

   goto: function (e) {let a =e.currentTarget.dataset.idwx.navigateTo({url: '../index/index?id'+id})}

另一个页面在 onLoad 接参数

 onLoad(options) {// console.log(options.id);let id =options.id},

 

第二种:wx.redirectTo(OBJECT)
关闭当前页面,跳转到应用内的某个页面。

OBJECT参数说明:

参数 类型 必填 说明
url String 是 需要跳转的应用内页面的路径

   goto: function (e) {let a =e.currentTarget.dataset.idwx.navigateTo({url: '../index/index?id'+id})}

第三种:wx.navigateBack(OBJECT)
关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages()) 获取当前的页面栈,决定需要返回几层。
OBJECT参数说明:

参数 类型 默认值 说明
delta Number 1 返回的页面数,如果 delta 大于现有页面数,则返回到首页。

 onLoad: function(options) {var pages = getCurrentPages()var num = pages.lengthnavigateBack:function(){wx.navigateBack({delta: num})}}

相关内容

热门资讯

奥地利小镇邂逅农民思想家多伊布... 旅游奥地利期间,每天与同行的徐静波教授晨起一同散步,有时沿着多瑙河,有时在维也纳的森林间,但给我印象...
读懂济南|从“一阵风”到“长红... 齐鲁晚报·齐鲁壹点 王贝艺大明湖畔的狂欢还未收尾,五龙潭的泼水狂欢又已开场;广智里的咖啡香还没散尽,...
黄河壶口瀑布水量大增 形成壮美...   9月9日,受降雨天气影响,位于晋陕峡谷的黄河壶口瀑布水量大增,主副瀑布连成一片,形成壮美瀑布群景...
“请3休13”点燃中秋国庆国内... 财联社9月10日讯(记者 胡皓琼)中秋前一日火车票开售,中秋国庆国内游预订提速。财联社记者从OTA平...
微言|游客暴增却带不来利润?“... 中秋、国庆假期将至,很多地方将迎来旅游旺季。然而,一些地方旅游人次创新高,民宿经营者却普遍反映利润摊...