微信小程序返回页以及页面路由的控制

其实小程序大家都会涉及到一个页面路由的问题,一个是正向的,页面A跳转到页面B,页面B跳转到页面C,还有一个就是反向操作,就是A,B,C页面正向跳转之后的返回,我们可不可以直接C返回到A页面呢?这就是这个问题所在,因为实际业务场景,我们不仅要正向跳转还要反向跳转。

举个例子,你做一个商城,下单后你希望用户天转到哪里,你可以在这个页面设置一下按钮,引导用户跳转到你想要他去的目标页。但是实际情况就是,用户说“我不,老子实体按键返回,或者我要点击上面导航栏的返回键,就是不点你的。”,于是 ABC三个页面,如果都是压栈的方式,就会出现A— B— C— B— A,奇怪路径,虽然说是原路返回,但是十分不符合业务,尤其是订单页返回又要到你要下单的页面,看起来就很有问题,产品使用逻辑上甚至会给人很大误导,留下十分不友好的印象。

其实怎么解决?其实有两种方式来解决,但实际只有一种算是勉强能用。介绍这两种方法时,先让我把官方文档糊在你脸上,毕竟没有什么比官方文档更权威的了。

微信小程序页面路由

为防止页面失联,我再截个图,咱一步一步谈页面路由,然后引出返回页的处理

首先你要知道一个“页面栈的东西”,就是管理页面进入的先后次序的,我们计算机程序操作很多都会涉及到栈,比如方法的压栈出栈,让程序跑起来。页面栈管理所有页面,但是我们可以通过路由方式来调整页面是否入栈。
在这里插入图片描述
没入栈的页面,返回时栈里找不到他,返回时就会“跳过去”,这就是我们第一种方式navigateTo,他操作的就不会把页面放进页面栈里。

wx.redirectTo({
  url: 'test?id=1'
})

还有一种就是我们常用的navigateBack,因为不是重定向那页面就会放在栈里面,但是你知道他大概位置,比如A—B---C的大致路径,你知道A和C中间就隔着一个B,你可以跳过他。这个delta是1就是上一个页面,以此类推,参看下面代码。

// 在C页面内 navigateBack,将返回A页面
wx.navigateBack({
  delta: 2
})

总结:
那问题来了,我推荐哪个呢?我推荐重定向,因为不入栈,小程序控制不了实体返回键的操作,就是你能自定义上面导航栏的返回键跳转通过条件判断navigateBack或者干脆navigateTo,但是你不能监控实体键就很蛋疼。

重定向直接不把页面放进栈里,返回时直接忽略,就省了很多麻烦事,做到操作一致,但是如果中间夹杂了不少跳转逻辑,有的时候我要C返回A,有的时候C返回B,甚至干脆就是跳转到另外一个页面,你可能要写不少相关的逻辑,甚至可能回答不到预期的效果,毕竟数据结构不是人,你不能让他自己“见机行事”,所以我们中间的逻辑要搞好。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值