当前位置:   article > 正文

小程序(uniapp)页面的跳转方式有哪些,他们之间的区别是什么?_uni.switchtab

uni.switchtab

1、uni.navigateTo: 保留当前页面,跳转到应用的某个页面,使用 uni.navigateBack 可以返回原页面。这种方式类似于网页的超链接跳转。

2、uni.redirectTo: 关闭当前页面,跳转大应用内的某个页面。这种方式类似于网页的重定向。

3、uni.switchTab: 跳转到tabBar页面,并关闭其他所有非tabBar页面。

4、uni.reLaunch: 关闭所有页面,打开到应用内的某个页面。

5、nui.navigateBack: 关闭当前页面,返回上一页或多级页面。

        这些跳转方式的主要区别在于他们对页面栈的处理方式不同。uni.navigateTo 会将新页面压入页面栈,而 uni.redirectTo 则不会打开新的页面,而 switchTab 和 reLaunch 、

        uni.switchTab 和 uni.reLaunch 则会关闭当前页面。uni.navigateBack 则会从页面栈中弹出当前页面,返回到上一页面或多级页面。

以下是这些跳转方式的代码示例:

  1. // uni.navigateTo
  2. uni.navigateTo({
  3. url: '/pages/example/example'
  4. });
  5. // uni.redirectTo
  6. uni.redirectTo({
  7. url: '/pages/example/example'
  8. });
  9. // uni.switchTab
  10. uni.switchTab({
  11. url: '/pages/example/example'
  12. });
  13. // uni.reLaunch
  14. uni.reLaunch({
  15. url: '/pages/example/example'
  16. });
  17. // uni.navigateBack
  18. uni.navigateBack({
  19. delta: 1
  20. });

在使用这些跳转方式时,需要注意以下几点:

       1、页面栈最大深度为10,当超过10时,需要使用 uni.redirectTo 或 uni.reLaunch。

       2、uni.switchTab 只能用于跳转到 tabBar 页面,不能指定参数。

       3、uni.reLaunch 可以关闭所有页面,包括 tabBar 页面。

        4、uni.navigateTo 和 uni.redirectTo 的跳转方式都可以指定参数。参数可以通过 URL 的查询字符串(query string)来传递。

        以下是使用 uni.navigateTo 和 uni.redirectTo 指定参数的代码示例:

  1. // uni.navigateTo
  2. uni.navigateTo({
  3. url: '/pages/example/example?param1=value1&param2=value2'
  4. });
  5. // uni.redirectTo
  6. uni.redirectTo({
  7. url: '/pages/example/example?param1=value1&param2=value2'
  8. });

        在上述示例中,我们通过查询字符串 ?param1=value1¶m2=value2 将参数 param1 和 param2 传递给目标页面。在目标页面中,我们可以通过 this.$route.query 来获取这些参数。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家小花儿/article/detail/656452
推荐阅读
相关标签
  

闽ICP备14008679号