莱州 网站制作,网站做字工具,微信视频网站建设多少钱,大学文明校园网站建设方案本文首发自个人自有博客#xff1a;【FaxMiao个人博客】#xff0c;一个关注Web前端开发技术、关注用户体验、记录前端点滴#xff0c;坚持更多原创#xff0c;为大家提供高质量技术博文#xff01;前言小程序的跳转方法有很多种#xff0c;有的人一直只用wx.navigateTo跳…本文首发自个人自有博客【FaxMiao个人博客】一个关注Web前端开发技术、关注用户体验、记录前端点滴坚持更多原创为大家提供高质量技术博文前言小程序的跳转方法有很多种有的人一直只用wx.navigateTo跳转由于页面栈限制跳着跳着小程序就没反应了今天就来说小程序的跳转几种跳转方式及作用。正文一、wx.switchTab跳转到 tabBar 页面并关闭其他所有非 tabBar 页面。需要跳转的 tabBar 页面的路径 需在 app.json 的 tabBar 字段定义的页面路径后不能带参数。wx.switchTab({url:pages/index/index
})
上面说了使用wx.switchTab跳转是不能在连接后面带参数的那我们要怎么解决呢我们可以通过在app.js定义一个全局变量跳转前赋值跳转后直接用全局变量就可以了代码如下app.jsglobalData: {parameter: 0
}
index.wxmlview bindtaptest点我跳转/viewindex.jsconst app getApp();
Page({test: function () {// 这里给全局变量赋值app.globalData.parameter 1;// 执行跳转wx.switchTab({url:pages/test/test})}
})
二、wx.redirectTo关闭当前页面跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。连接后可以拼接参数。wx.redirectTo({url: ../test/test?id1
})
三、wx.reLaunch关闭所有页面打开到应用内的某个页面目标页面。连接后可以拼接参数wx.reLaunch({url: ../test/test?id1
})
wx.reLaunch()与 wx.redirectTo()的用途基本相同 只是wx.reLaunch()会先关闭内存中所有保留的页面再跳转到目标页面。四、wx.navigateTo保留当前页面跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。wx.navigateTo({url: ../test/test?id1
})
对于页面不是特别多的小程序通常推荐使用 wx.navigateTo进行跳转 以便返回原页面以提高加载速度。当页面特别多时则不推荐使用。五、wx.navigateBack关闭当前页面返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈决定需要返回几层。wx.navigateBack({delta: 1 //返回的页数
})
很多时候我们需要在返回上一页面的时候携带参数回去或者修改原有参数值来改变页面的展示效果等。这里我们就需要用到getCurrentPages了代码如下back: function () {let pages getCurrentPages(); // 获取加载的页面对象let prevPage pages[pages.length - 2]; // 获取上一页的页面对象1代表当前页2代表上一页// 把上一页参数num值改为1prevPage.setData({num: 1})// 返回上一页wx.navigateBack({delta: 1})
}
效果图六、wxml页面组件navigator跳转【官方文档】navigator url../test/test?id1 open-typenavigate/navigatoropen-type跳转方式navigate、redirect、switchTab、reLaunch、navigateBack也就是本文前5点跳转方法。navigate对应 wx.navigateTo 或 wx.navigateToMiniProgram 的功能redirect对应 wx.redirectTo 的功能switchTab对应 wx.switchTab 的功能reLaunch对应 wx.reLaunch 的功能navigateBack对应 wx.navigateBack 的功能总结wx.switchTab跳转到tabbar页面最好选择因为它会先关闭所有非tabbar的页面。因为微信对小程序页面栈有限制所以适当使用wx.redirectTo、wx.redirectTo()可以避免跳转前页面占据运行内存。
