微信小程序的一些页面跳转方法

第一种:<navigator></navigator>标签.

这是最常见的一种跳转方式,相当于html里的a标签.但需要注意的是 该方法不能跳转tabbar页面.

格式为:

<navigator url="........"></navigator>

第二种:wx.navigateTo.

通过构造js函数,在函数中调用该接口可实现页面跳转的效果.但该接口同样不能跳转tabbar页面.跳转后左上角有返回小箭头,点击可返回原本页面.

格式为:

<view class="select_calculator" bindtap="next_calculator">
next_calculator:function () {
    wx.navigateTo({
      url: '/pages/calculator/calculator',
    })
 
  },

第三种:wx.redirectTo.

 关闭当前页面,跳转到应用内的某个页面(不能跳转tabbar页面)。类似于html中的 window.open('.....');

在跳转到的新页面中,左上角会显示一个返回小箭头,用户点击后可以返回到之前的页面。但需要注意的是,如果原本页面是通过 wx.switchTab 跳转到的 tabbar 页面,则返回后会回到该 tabbar 页面的初始状态,而不是之前的状态。

另外,需要注意的是,在 wx.redirectTo 跳转后的目标页面中,是无法通过 wx.navigateBack 回到之前的页面的,因为在跳转时,原本页面已经被关闭了。如果需要返回到原本页面,应该使用 wx.navigateTo 或 wx.switchTab,或者在目标页面中提供返回按钮或其他返回方式。

第四种:wx.switchTab.

跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面;该方法只能跳转tabbar页面.

例如:

  post_calculator:function () {
    wx.switchTab({
      url: '/pages/calculator/calculator', //  tabBar 页面
    })
  },
 
})

第五种:wx.reLaunch.

关闭所有页面,打开到应用内的某个页面。

跟 wx.redirectTo 不同的是在使用 wx.reLaunch 后,无法通过左上角返回小箭头返回原本的页面。因此,wx.reLaunch 适用于应用内的导航或者流程结束后的跳转。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

GG--Bond

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值