首页IT科技uniapp实现页面跳转(uniapp页面跳转的几种方式)

uniapp实现页面跳转(uniapp页面跳转的几种方式)

时间2025-08-03 03:46:34分类IT科技浏览5442
导读:uniapp页面跳转的几种方式 一、uni.navigateTo...

uniapp页面跳转的几种方式

一                、uni.navigateTo

定义:保留当前页面                ,跳转到应用内的某个页面                      ,使用uni.navigateBack可以返回到原页面                。 使用:

// 1.不传参 uni.navigateTo({ url:./home/index }); // 2.传参字符串 uni.navigateTo({ url:`./home/index?title=${title}` }); // 3.传参对象 // 传入 let data = { title:hello, id: 1 } uni.navigateTo({ url:`./home/index?data=`+ encodeURIComponent(JSON.stringify(data)) }) // 接受参数 onLoad: function (option) { const item = JSON.parse(decodeURIComponent(option.item)); }

二                      、uni.redirectTo

定义:可以关闭当前界面并跳转到其他的非tabbar界面(可带参数) 使用:

uni.redirectTo({ url:./home/index });

三        、uni.reLaunch

定义:关闭所有页面        ,打开到应用内的某个页面(可带参数) 使用:

uni.reLaunch({ url:./home/index });

四            、uni.switchTab

定义:跳转到 tabBar 页面            ,并关闭其他所有非 tabBar 页面 使用:

uni.switchTab({ url:./home/index });

五                      、uni.navigateBack

定义:关闭当前页面                      ,返回上一页面或多级页面 使用:

uni.navigateBack({ url:./home/index }); uni.navigateBack({ delta: 2 });

总结

navigateTo, redirectTo 只能打开非 Tab 页面            ,可传参                      。

switchTab 只能打开 Tab 页面        ,不可传参        。

reLaunch 可以打开任意页面                      ,可传参            。

创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!

展开全文READ MORE
黑马程序员web前端培训(黑马程序员前端学习接口变更) php搭建邮件服务器(phpcms怎么配置邮箱)