一、微信小程序导航组件 navigator使用
<navigator url = '/pages/demo/index'>跳转到demo页面</navigator>
<navigator url = '/pages/my/index'>跳转到tabBar页面</navigator>
<navigator url = '/pages/log/index' open-type="redirect">redirect替换demo页面</navigator>
<navigator url = '/pages/my/index' open-type="switchTab">跳转到tabBar页面</navigator>
<navigator url = '/pages/demo/index' open-type="reLaunch">reLaunch到demo页面</navigator>
使用注意事项及区别: 正常跳转不会跳转到tabBar页面,只有使用switchTab才能跳转到tabBar相关页面。 redirect会覆盖路由历史记录中的最后一个页面–历史记录中是 index log reLaunch会覆盖之前所有的历史记录,只留下最后跳转到的页面–demo switchTab 跳转到 tabBar 页面,并关闭其他所有非tabBar 页面
js中实现路由跳转 1.wx.navigateTo 跳转到一个新的页面,会新增一种历史记录
Page({
navigateTo() {
wx.navigateTo({
url: '/pages/logs/logs?name=小刚&age=19',
success() {}
});
},
})
2.wx.redirectTo
Page({
redirectTo() {
wx.redirectTo({
url: '/pages/logs/logs?name=小刚&age=19',
});
},
});
3.wx.navigateBack 返回页面,参数 delta 可以指定返回前几个页面。 结合getCurrrenPages() 获取页面栈 ,确定要回退的步数。
Page({
navigateBack() {
wx.navigateBack({
delta: 0,
});
},
});
二、路由跳转页面传参&接收参数
方式一:url拼接参数
<navigator url = '/pages/demo/index?name=小明&age=18'>跳转到demo页面</navigator>
onLoad({name,age){
}
方法二: 在点击
<van-cell title="哼唧家园" mark:point="哼唧家园" bind:tap="getBuilding" is-link />
getBuilding(ev){
console.log(ev.mark.point)
}
|