路由跳转:
微信小程序跳转提供了6中路由跳转方式:
wx.switchTab(Object object):跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面
即只能跳转到app.json中定义的tabBar页面
"tabBar": {
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "./image/tabBar/tabBar_index.png",
"selectedIconPath": "./image/tabBar/tabBar_index_hover.png"
},
{
"pagePath": "pages/myMessage/myMessage",
"text": "我的",
"iconPath": "./image/tabBar/tabBar_user.png",
"selectedIconPath": "./image/tabBar/tabBar_user_hover.png"
}
]
}
wx.redirectTo(Object object):关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabBar 页面
即只能跳转到除了上面注册tabBar的页面
所以wx.switchTab(Object object)和wx.redirectTo(Object object)是相对的
wx.navigateTo(Object object):保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。
与wx.redirectTo的区别就是是否保存现在的页面,比较适用于详情页,经常需要跳转回去
wx.navigateBack(Object object):关闭当前页面,返回上一页面或多级页面,可以传入一个参数,作为返回的页数,
wx.navigateBack(2) 返回前2页
wx.reLaunch(Object object):关闭所有页面,打开应用中的某个页面
<navigate />:直接在wxml中使用该标签包裹,使用url属性指向跳转的页面
传递参数:
直接使用url传递,简单的数据
如:发送给跳转页面
wx.navigateTo({
url: '../detail/detail?id=1'
})
跳转页面在onLoad()函数会获取到一个option(自定义名)的参数,该参数就包含了
Page({
onLoad(options) {
console.log(options)
}
})
输出了
如果是对象这类数据比较多的,也可以用该方法,不过需要将对象先转化为字符串,这里使用了JSON.stringify和JSON.parse
wx.navigateTo({
url: '../detail/detail?form=' + JSON.stringify(_this.data.foodsList)
})
onLoad: function (options) {
console.log(form: JSON.parse(options.form))
}
输出了