navigator(组件)
页面链接,官方文档详细参数说明。
栗子:
<!--wxml代码-->
<!--
url:跳转的地址
redirect:是否在本页打开,默认是false
hover-class:点击时的样式
-->
<view>
<navigator url="../../pages/lists/lists" redirect="true" hover-class="navigator-hover">点我去列表页</navigator>
</view>
/* wxss代码 */
.navigaror-hover{
color:blue;
}
wx.navigateTo(OBJECT)
保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。官方文档参数详细说明
<!--wxml-->
<!--这里绑定了一个detial方法,同时获取id值-->
<view class="img">
<image src="{{img}}" data-id="{{id}}" bindtap="detail"></image>
</view>
//js:detail事件
//url:要跳转的地址,event.target.dataset.id为接受上面的id参数
detail:function(event){
wx.navigateTo({
url:"../../pages/detail/detail id="+event.target.dataset.id,
//接口调用成功的回调方法
fuccess:function(){},
/接口调用失败的回调方法
fail:function(){},
/接口调用无论成功或者失败的回调方法
complete:function(){}
})
},
wx.redirectTo(OBJECT)
关闭当前页面,跳转到应用内的某个页面。参数与wx.navigatorTo(ONJECT)相同。
wx.navigateBack(OBJECT)
关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages()) 获取当前的页面栈,决定需要返回几层。官方文档详细参数说明
<!--wxml-->
<!--这里绑定一个back事件-->
<view>
<view bindtap="back" class="back">返回</view>
</view>
//js
//wx.navigateBack()的参数是返回基层
back:function()
{
wx.navigateBack(1);
}