当前位置: 首页 > 工具软件 > NUI > 使用案例 >

nui-app 页面跳转问题

陈瀚玥
2023-12-01

页面跳转问题

1 需求- - -跳转到当前页

1.1 常用的三个页面跳转函数的区别

函数名作用
uni.switchTab跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。
uni.navigateTo保留当前页面,跳转到应用内的某个页面,使用uni.navigateBack可以返回到原页面。
uni.reLaunch关闭所有页面,打开到应用内的某个页面。
  • switchTab,只能打开tabbar页面
  • navigateTo,只能打开非tabbar页
  • reLaunch,可以打开所有页面

1.2 解决方案

根据上述三个函数的特性,我么使用uni.reLaunch来跳转到当前页面。

举个栗子,当前是一个tabbar页面,路径为:pages/order/index,代码示例如下:

uni.reLaunch({
    url:"/pages/order/index"
});

2 需求:跳转页面,并切换current

2.1 需求分析

current:这里表示的是页面的tab (在一个页面顶部放置了两个tab,通过current来切换当前显示的tab,默认current=0,即显示第一个)

因此,我们可以在跳转时,将current设置成我们需要现实的tab

2.2 解决方案

  1. 设置全局变量currentOrder=0,
  2. 在该tab页面的mounted函数中,设置current=currentOrder
  3. 改变全局变量currentOrder,然后跳转到指定的tab页面
 类似资料: