小程序 关于页面的跳转

在小程序开发中 因为小程序是搭载在微信中的 所以我们平常所用的Js或者JQuery等页面跳转的方法都不能使用了 但小程序也自带了几种页面跳转的方式 下面来逐一介绍

微信官方开放文档： 戳这里查看
第一种方式
wx.navigateTo(Object object)
保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层

这种跳转方式默认有返回按钮，返回到上一个页面

    wx.navigateTo({
      url: '../register/student/index/index',
    })

第二种方式
wx.navigateBack(Object object)
关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。

// 注意：调用 navigateTo 跳转时，调用该方法的页面会被加入堆栈，而 redirectTo 方法则不会。见下方示例代码

// 此处是A页面
wx.navigateTo({
  url: 'B?id=1'
})

// 此处是B页面
wx.navigateTo({
  url: 'C?id=1'
})

// 在C页面内 navigateBack，将返回A页面
wx.navigateBack({
  delta: 2
})

第三种方式
wx.redirectTo(Object object)
关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

这种跳转方式默认有返回按钮，返回到上一个页面的再上一层

wx.redirectTo({
  url: 'test?id=1'
})

第四种方式
wx.switchTab(Object object)
跳转到 tabBar 页面（需在 app.json 的 tabBar 字段定义的页面），并关闭其他所有非 tabBar 页面

当要跳转的页面是由tabbar定义的页面的时候，就要用到此方法。并且除了该方法其他的都不能跳转到tabar定义过的页面

wx.switchTab({
  url: '/index'
})

第五种方式
wx.reLaunch(Object object)
关闭所有页面，打开到应用内的某个页面

这种跳转方式默认没有返回按钮，不需要默认返回按钮的页面就可以使用此方法

wx.reLaunch({
  url: 'test?id=1'
})

---

第六种方式
小程序组件navigator
详细查看手册文档

属性	说明
target	在哪个目标上发生跳转，默认当前小程序
url	当前小程序内的跳转链接
open-type	跳转方式
delta	当 open-type 为 ‘navigateBack’ 时有效，表示回退的层数
path	当target="miniProgram"时有效，打开的页面路径，如果为空则打开首页
extra-data	当target="miniProgram"时有效，需要传递给目标小程序的数据，目标小程序可在 App.onLaunch()，App.onShow() 中获取到这份数据。

重要的是open-type的值：

navigate 对应 wx.navigateTo 或 wx.navigateToMiniProgram 的功能
redirect 对应 wx.redirectTo 的功能
switchTab 对应 wx.switchTab 的功能
reLaunch 对应 wx.reLaunch 的功能
navigateBack 对应 wx.navigateBack 的功能
exit 退出小程序，target="miniProgram"时生效

六种方式都能实现页面跳转 但大多有所不同 要注意的地方我已经给出了标记 用的时候注意一下标记的地方再使用的话应该没有什么问题了
希望能给你们带来帮助