作者:潘景洪Phant_255 | 来源:互联网 | 2023-06-12 14:41
首先,要先说一下项目的需求,我要实现的功能是在首页有一个按钮可以跳转到一个展示的页面,这个展示的页面上下两个部分,上边的部分是可以切换学科种类的,下面的部分可以展示这个学科下的所有
首先,要先说一下项目的需求,我要实现的功能是 在首页有一个按钮可以跳转到一个展示的页面,这个展示的页面上下两个部分,上边的部分是可以切换学科种类的,下面的部分可以展示这个学科下的所有科目,上面切换的部分可以再跳转到另一个页面来选择学科,所以就出现一个问题,当我要频繁的切换学科的时候,我这个展示的页面点击左上角返回的按钮(无论是怎样都要直接返回首页的),是返回上一个页面,并不能直接返回首页,所以就这个问题想了好久,一步步的解决了。
一、重构小程序的头部,这种方法对我这个项目来说不太合适,在这里就不多说了。
二、利用小程序的unLoad这个生命周期,在这个生命周期中使用重定向,无论是到哪里,在卸载这个页面的时候,都让他跳转到固定的页面
onUnload: function () {
wx.reLaunch({
url: '../home/home'
})
},
但是这样就会出现很多问题,比如身份丢失,页面在跳转的时候会闪屏,用户体验的效果也是极差的,并不推荐使用这种方法,其实遇到这种问题,最好的方法还是第一种自己配置头部,但是这个在项目开始的时候就完成这个需求,不然等到项目中间再弄就非常的麻烦了
三、利用wx.navigateBack()来实现页面的返回,并不是通过wx.navigateTo,这样就使得这个页面并不在返回跳转的路径中了。.
但是这样有个问题,我们在跳转页面的时候,往往都是携带参数的,但是wx.navigateBack()是不能直接携带参数的,但是我们可以通过另一种方法直接操作上一个页面的data数据。
var pages = getCurrentPages();
var Page = pages[pages.length - 2];
Page.setData({
currentIndex: e.detail
})
console.log(e.detail)
Page.clickCards(e.detail)
//默认返回上一页
wx.navigateBack()
通过上述的代码,我们首先通过 getCurrentPages() 这个方法获取到页面栈,然后通过页面栈获取到上一个页面,然后可以直接嗲用上一个页面的方法,改变上一个页面的值,然后再通过navigateBack() 返回到上一个页面,这样就能比较好的解决我的那个问题了。