小程序页面路由共有5个api,使用这些页面路由首先你要到在小程序的主配置文件 app.json 里面配置你页面的路径，这些页面你可以放到pages目录下，也可以定义到pages目录下子目录的文件夹，例如pages/index/index。
{"pages": [
"pages/logs/index",
"pages/index/index",
"pages/user/index",
"pages/my/index"
]}
1.Tab 切换 wx.switchTab(Object object)
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面,这个api只能跳转到底部导航设置的几个页面，它是不能跳转到其他单独页面的。
switchTab切换的页面
代码示例 （调用 API wx.switchTab 或使用组件 <navigator open-type="switchTab"/> 或用户切换 Tab）
底部导航的设置路径是到app.json里面设置是
{
"tabBar":{
"list":[{
"pagePath":"page/tabBar/index/index",//路径设置
"text":"首页"
},{
"pagePath":"page/cart/cart",
"text":"购物车"
},{
"pagePath":"page/tabBar/userCenter/userCenter",
"text":"我的"
}]
}
}
wx.switchTab({url:'/index'}) ;//跳转到指定URL地址
2.打开新页面 wx.navigateTo(Object object)
保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。
代码示例 （调用 API wx.navigateTo 或使用组件 <navigator open-type="navigateTo"/>）
wx.navigateTo({
url: 'test?id=1',
events: {// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
acceptDataFromOpenedPage: function(data) {
console.log(data)
},
someEvent: function(data) {
console.log(data)
}
...
},
success: function(res) {
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
}
})
在A页面跳转到B页面，路由前页面A路由为onHide生命周期，跳转到B页面路由onLoad, onShow生命周期
3.页面重定向 wx.redirectTo(Object object)
关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。
代码示例 (调用 API wx.redirectTo 或使用组件 <navigator open-type="redirectTo"/>)
wx.redirectTo({url:'test?id=1'})
在A页面跳转到B页面，路由前页面A路由为onUnload生命周期，跳转到B页面路由onLoad, onShow生命周期
4.重启动 wx.reLaunch(Object object)
关闭所有页面，打开到应用内的某个页面
代码示例 (调用 API wx.reLaunch 或使用组件 <navigator open-type="reLaunch"/>)
wx.reLaunch({url:'test?id=1'})
在A页面跳转到B页面，路由前页面A路由为onUnload生命周期，跳转到B页面路由onLoad, onShow生命周期
5.页面返回 wx.navigateBack(Object object)
关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。
// 注意：调用 navigateTo 跳转时，调用该方法的页面会被加入堆栈，而 redirectTo 方法则不会。
代码示例 (调用 API wx.navigateBack 或使用组件<navigator open-type="navigateBack">或用户按左上角返回按钮)
// 此处是A页面
wx.navigateTo({url:'B?id=1'})
// 此处是B页面
wx.navigateTo({url:'C?id=1'})
// 在C页面内 navigateBack，将返回A页面wx.navigateBack({delta:2})
在A页面跳转到B页面，路由前页面A路由为onUnload生命周期，跳转到B页面路由onShow生命周期
Tips：
navigateTo,redirectTo只能打开非 tabBar 页面。
switchTab 只能打开 tabBar 页面。
reLaunch 可以打开任意页面。
页面底部的 tabBar 由页面决定，即只要是定义为 tabBar 的页面，底部都有 tabBar。
调用页面路由带的参数可以在目标页面的onLoad中获取。
网友评论