微信小程序里的路由函数解析（wx.switchTab、wx.reLaunch、wx.redirectTo、wx.navigateTo、wx.navigateBack）

官方文档：微信小程序路由

一、wx.switchTab(跳转tabBar页面，不可传参)

跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面

属性	类型	必填	说明
url	string	是	需要跳转的 tabBar 页面的路径 (代码包路径)（需在 app.json 的 tabBar 字段定义的页面），路径后不能带参数。
success	function	否	接口调用成功的回调函数
fail	function	否	接口调用失败的回调函数
complete	function	否	接口调用结束的回调函数（调用成功、失败都会执行）

// app.json
{
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首页"
    },{
      "pagePath": "pages/about/about",
      "text": "关于"
    }]
  }
}

//js
wx.switchTab({
  url: '/pages/about/about'
})

注意路径问题要路径前加/,这个问题出现它及不能跳转页面，也不会报错

跳转后页面的左上角无任何图标可以点击

二、wx.reLaunch(先关闭所有页面，再跳转任何页面包括tabBar，可传参)

关闭所有页面，打开到应用内的某个页面

与wx.redirectTo()用法类似

wx.reLaunch({
      url: '/pages/index/index?name=zs&age=12',
      success:function(){
        console.log('hello index')

      }
    })

// index.js
onLoad: function (option) {
    console.log(option)
    // {name: "zs", age: "12"}
  }

三、wx.redirectTo(跳转关闭当前页，可传参)

关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabBar 页面。

属性	类型	必填	说明
url	string	是	需要跳转的应用内非 tabBar 的页面的路径 (代码包路径), 路径后可以带参数。参数与路径之间使用 ? 分隔，参数键与参数值用 = 相连，不同参数用 & 分隔；如 ‘path?key=value&key2=value2’
success	function	否	接口调用成功的回调函数
fail	function	否	接口调用失败的回调函数
complete	function	否	接口调用结束的回调函数（调用成功、失败都会执行）

wx.redirectTo({
      url: '/pages/index/index?name=zs&age=12',
      success:function(){
        console.log('hello index')
      }
    })

// index.js
onLoad: function (option) {
    console.log(option)
    // {name: "zs", age: "12"}
  }

跳转后页面左上角显示，可以返回首页（及app.json中pages数组中的第一个路由）

四、wx.navigateTo(跳转保存当前页，可传参)

保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabBar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。

属性用法与wx.redirectTo基本相同

wx.navigateTo({
      url: '/pages/index/index?name=zs&age=12',
      success:function(){
        console.log('hello index')
      }
    })`在这里插入代码片`

// index.js
  onLoad: function (option) {
    console.log(option)
     // {name: "zs", age: "12"}
   }

跳转后左上角显示可返回上一页箭头

五、wx.navigateBack（跳转页面栈）

关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages获取当前的页面栈，决定需要返回几层。

属性	类型	默认值	必填	说明
delta	number	1	否	返回的页面数，如果 delta 大于现有页面数，则返回到首页。
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

  btnHandle3() {
    wx.navigateBack({
      delta:1
    })
  },

六、wx.redirectTo和wx.navigateTo的区别

• wx. redirectTo()会使当前界面进入unload状态，即关闭该页面，将无法回到当前页面。
• wx.navigateTo()导航到另一个页面，会将当前的页面隐藏起来，使页面进入hide状态，并不会关闭可以通过返回按钮回到当前的页面

搭配内容：微信小程序知识点整理(五)——页面导航