小程序里面的链接使用navigator组件
在html中使用a标签, a标签可以链接到网络中的任何地址 而小程序中navigator只能应用于当前小程序内的链接跳转 <navigator url="http://www.baidu.com">跳转A</navigator>
<navigator url='test/t'>跳转B</navigator> 第一个是无效的 第二个能正确跳转, 需要注意的是: url中的页面不能是tabBar(底部菜单)中的页面 但是可以通过open-type属性设置 redirect属性, 打开新页面时, 关闭原页面(在新页面, 不能再返回到原页面) <navigator redirect url='test/t'>跳转</navigator> 跳转时并传递参数(不用加上引号, 自动会加上双引号, 否则就多余一个引号, 因此直接写: id=111&name=张三): <navigator url='test/t?id=111&name=张三'>跳转</navigator> 通过onLoad事件获取url参数, 在加载这个页面时自动将参数放入 <navigator url='test/t?id=111&name=张三' hover-class='hoverClass'>跳转</navigator> <!--链接1-->
<navigator url='test/t?id=123&name=小明'>跳转</navigator> <!--链接2--> Page({
data: {
},
onLoad : function(datas) {
console.log(datas);
}
}) 如果点击链接1, 则datas的值是{id: "111", name: "张三"}, 点击链接2, 则datas的值是{id: "123", name: "小明"} hover-class是点上去后的样式 wx.navigateTo 此Api也可以完成页面跳转, 与navigator(无redirect属性)相同 <button size='mini' bindtap="navigator">跳转</button> navigator : function() {
wx.navigateTo({
url: 'test/t?id=100&user=xiaoming',
success : function(e) {
console.log(e.errMsg);
}
})
} wx.redirectTo 此Api也也可以完成页面跳转, 与navigator(有redirect属性)相同, 操作与上相同 wx.navigateBack 此Api用于返回, 从当前页面返回到上级页面(根据如下参数) Page({
data: {
},
back : function() {
wx.navigateBack({
delta : 1 // 值为1, 则是返回上一级, 值为2就返回上两级...
})
}
}) 如果dellta的值为1, 则可以不写dellta属性: wx.navigateBack({}) 如果dellta的值超过了其能返回的总级数, 则会返回首页 相关文章: 链接到本页面 微信小程序组件:navigator页面链接解读和分析 相关视频: 页面链接和多媒体-微信小程序项目实战视频教程 以上就是如何从小程序外部跳转到指定的小程序页面_小程序页面获取链接的详细内容,更多请关注模板之家(www.mb5.com.cn)其它相关文章! |