美文网首页
小程序路由跳转传值

小程序路由跳转传值

作者: 菜鸟白泽 | 来源:发表于2020-07-21 15:32 被阅读0次

    路由跳转的方法


    • wx.switchTab:跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面

    • wx.reLaunch:关闭所有页面,打开到应用内的某个页面

    • wx.redirectTo:关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面

    • wx.navigateTo:保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层

    • wx.navigateBack:关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈,决定需要返回几层。

    简单说明



    (1)wx.switchTab:跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面

    image

    非 tabBar 页面跳转到 tabbar 页面

    首页不是含tabBar 页面,比如登录页,欢迎页,主页含 tabBar 页面。由首页通过wx.redirectTo 跳转到主页时,没有效果。
    
    经测试需要这样:非 tabBar 页面 跳转到 tabBar 页面,必须通过 wx.switchTab 完成,不能用 wx.redirectTo 等其它方式。
    

    (2)wx.reLaunch:关闭所有页面,打开到应用内的某个页面

    个人感觉该方法的应用场景如下:
    
    打开多个页面之后,要直接返回首页,此时之前的页面都应该关闭,然后打开首页。
    

    (3)wx.redirectTo:关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面

    应用场景:从 tabbar 页面跳转到非 tabbar 页面

    image
    wx.redirectTo,四级页面跳转到二级页面,会关掉四级页面(当前页面),由二级页面替换掉,此时页面栈中有两个二级页面。
    

    (4)wx.navigateTo:保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack可以返回到原页面。小程序中页面栈最多十层

    image
    使用 wx.navigateTo,打开一个页面就会在页面栈中增加一个页面,不会销毁或关闭,直到打开10个页面。
    

    ** 注意**:之前,页面栈最多5层,新的官方文档里说是最多10层,查看官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/route/wx.navigateTo.html

    (5)wx.navigateBack:关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages获取当前的页面栈,决定需要返回几层。

    image
    开始我以为,wx.navigateBack 与 wx.navigateTo 对应,wx.navigateTo 是一个个往页面栈里加,wx.navigateBack 是依次从页面栈中减掉。后来发现 delta 字段,它可以跳着返回。
    
    • 当delta为1,一级一级跳,页面栈大小减1;

    • 当delta为2,隔着跳,从 A 页面调到 C 页面,中间有 B 页面,A、B都会关闭,页面栈大小减2;

    • 以此类推,直到栈底为止,也就是首页

    扩展


    1. wx.redirectTo 和 wx.switchTab 都是先清除栈中当前的页面,然后目标页面进栈,使用这两种跳转方式,都不能通过系统的返回键回到上一个页面,而是直接退出小程序;

    2. 栈底的一级页面,即为首页。

    3. getCurrentPages:https://developers.weixin.qq.com/miniprogram/dev/reference/api/getCurrentPages.html

    相关文章

      网友评论

          本文标题:小程序路由跳转传值

          本文链接:https://www.haomeiwen.com/subject/adiikktx.html