Native - Miniprogram页面跳转
wx.navigateTo
保留当前页面,跳转到应用内的某个页面,但不能跳转tabbar页面
wx.navigateBack可返回到原页面,小程序中页面栈最多十层
参考连接
wx.navigateTo({ url: '/goods/detail?id=312', events: { 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据 }, success: function(res) { // 通过eventChannel向被打开页面传递数据 res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' }) } } //test.js Page({ onLoad: function(option){ console.log(option.query) const eventChannel = this.getOpenerEventChannel() eventChannel.emit('acceptDataFromOpenedPage', {data: 'test'}); eventChannel.emit('someEvent', {data: 'test'}); // 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据 eventChannel.on('acceptDataFromOpenerPage', function(data) { console.log(data) }) } })
使用场景:跳转到新页面并保留原页面状态,eg: 从列表页面跳转到详情页面
缺点:每次跳转都会创建新页面,可能会占用较多的内存资源
wx.redirectTo
关闭当前页面,跳转到应用内的某个页面,但不允许跳转到tabbar页面
wx.redirectTo({ url: "../carDetails/carDetails" })
场景:关闭当前页面并跳转新页面 eg: 登录成功跳转登录页
优点:直接关闭当前页面,减少内存占用,缺点:无法保留原页面的状态,用户返回时会重新加载页面
wx.reLaunch
需要跳转的应用内页面路径 (代码包路径),路径后可以带参数。参数与路径之间使用?分隔,参数键与参数值用=相连,不同参数用&分隔;如
'path?key=value&key2=value2'
关闭所有页面,打开到应用内的某个页面
参考连接
wx.reLaunch({ url: 'test?id=1' }) // test页面 Page({ onLoad(option) { console.log(option.query) } })
wx.switchTab
跳转到tabBar页面,并关闭其他所有非tabBar页面,该方法只能跳转tabbar页面
wx.swtichTab({ url: '../install/install' })
需要跳转到tabBar页面eg: 从其他页面跳转到首页
优点:可直接跳转到tabBar页面,无法保留原页面的状态,用户返回时会重新加载页面
<navigator url="../carDetails/carDetails"><button>我是A页面,点击跳转到B页面</button></navigator>
适用于需要在页面中添加跳转链接的情况,eg: 在列表页中点击某个项目跳转到详情页
学而不思则罔,思而不学则殆!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· winform 绘制太阳,地球,月球 运作规律
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· AI 智能体引爆开源社区「GitHub 热点速览」
· 写一个简单的SQL生成工具