【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?

这篇具有很好参考价值的文章主要介绍了【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

面试官:说说微信小程序中路由跳转的方式有哪些?区别?

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

一、是什么

微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能

在微信小程序中,每个页面可以看成是一个 pageModelpageModel 全部以栈的形式进行管理

二、有哪些

常见的微信小程序页面跳转方式有如下:

  • wx.navigateTo(Object)
  • wx.redirectTo(Object)
  • wx.switchTab(Object)
  • wx.navigateBack(Object)
  • wx.reLaunch(Object)

wx.navigateTo(Object)

wx.navigateTo()用于保留当前页面、跳转到应用内的某个页面,使用 wx.navigateBack可以返回到原页面

对于页面不是特别多的小程序,通常推荐使用 wx.navigateTo进行跳转, 以便返回原页面,以提高加载速度。当页面特别多时,则不推荐使用

参数表如下所示:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

流程图如下:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

wx.redirectTo(Object)

重定向,当页面过多时,被保留页面会挤占微信分配给小程序的内存,或是达到微信所限制的 10 层页面栈的情况下,我们应该考虑选择 wx.redirectTo

wx.redirectTo()用于关闭当前页面,跳转到应用内的某个页面

这样的跳转,可以避免跳转前页面占据运行内存,但返回时页面需要重新加载,增加了返回页面的显示时间

参数表如下所示:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

流程图如下所示:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

wx.switchTab(Object)

跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面

参数表如下所示:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

wx.navigateBack(Object)

wx.navigateBack() 用于关闭当前页面,并返回上一页面或多级页面,开发者可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层则设置对象的delta属性即可

参数表如下:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

wx.reLaunch(Object)

关闭所有页面,打开到应用内的某个页面,返回的时候跳到首页

流程图如下所示:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

参数表如下所示:

【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?,面试合集,面试,微信小程序,职场和发展

三、总结

关于上述五种跳转方式,做下总结:

  • navigateTo 保留当前页面,跳转到应用内的某个页面,使用 wx.navigateBack 可以返回到原页
  • redirectTo 关闭当前页面,跳转到应用内的某个页面
  • switchTab 跳转到 tabBar 页面,同时关闭其他非 tabBar 页面
  • navigateBack 返回上一页面
  • reLanch 关闭所有页面,打开到应用内的某个页面

其中关于它们的页面栈的关系如下:

  • avigateTo 新页面入栈

  • redirectTo 当前页面出栈,新页面入栈

  • navigateBack 页面不断出栈,直到目标返回页,新页面入栈

  • switchTab 页面全部出栈,只留下新的 Tab 页面

  • reLanch 页面全部出栈,只留下新的页面

参考文献

面出栈,新页面入栈文章来源地址https://www.toymoban.com/news/detail-803633.html

  • navigateBack 页面不断出栈,直到目标返回页,新页面入栈
  • switchTab 页面全部出栈,只留下新的 Tab 页面
  • reLanch 页面全部出栈,只留下新的页面

到了这里,关于【面试合集】说说微信小程序中路由跳转的方式有哪些?区别?的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序页面跳转的区别

    ①wx.navigateTo:跳转到新页面,可以返回上一层页面 ②wx.redirectTo:跳转到新页面并且关闭当前页面,不可以返回上一层页面(跳转到指定的非TabBar页面) ③wx.reLaunch:跳转到新页面并且关闭当前所有页面,不可以返回上一层页面 ④wx.switchTab:跳到属于tabBar的页面

    2024年02月13日
    浏览(43)
  • 微信小程序之间是如何跳转的,并携带参数

    要实现小程序之间的跳转,需要使用小程序的跳转 API。具体步骤如下:         1、在原小程序中,使用  wx.navigateToMiniProgram  API 跳转到目标小程序。         2、在目标小程序中,接收参数并进行处理。在目标小程序中,可以使用wx.getLaunchOptionsSync API获取原始启动参

    2024年02月16日
    浏览(49)
  • 微信小程序和H5之间相互跳转的几种情况

    直接通过web-view内嵌的方式,有且只有这一种方式。 H5内嵌在小程序的web-view中,想要打开小程序自身的页面,可通过 wx.miniProgram.navigateTo 方法,参考链接:web-view | 微信开放文档 (qq.com) H5在非小程序环境中,微信浏览器或者手机自带浏览器打开时,想要跳转到小程序,可通过

    2024年02月11日
    浏览(49)
  • uniapp 微信小程序 路由跳转

    保留当前页面,跳转到应用内的某个页面,使用 uni.navigateBack 可以返回到原页面 uni.redirectTo(OBJECT) 关闭当前页面,跳转到应用内的某个页面。 uni.reLaunch(OBJECT) 关闭所有页面,打开到应用内的某个页面。       怎么隐藏左上角按钮       生命周期加入 会隐藏左上角按钮(必须

    2024年02月11日
    浏览(48)
  • 微信小程序常用路由跳转方法

            navigator 标签         属性:                 url:要跳转的路径(可以使用相对路径,也可以使用绝对路径)                 open-type:跳转方式。默认值为 navigat ,不能跳转至tabBar页面。                                     当值为  swi

    2024年02月09日
    浏览(45)
  • 微信小程序中路由跳转方式

    常见的微信小程序页面跳转方式有如下: wx.switchTab(Object) : 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 (面全部出栈,只留下新的 Tab 页面) wx.reLaunch(Object) : 关闭所有页面,打开到应用内的某个页面 (页面全部出栈,只留下新的页面) wx.redirectTo(Object) : 关闭当前

    2024年04月29日
    浏览(42)
  • Base64加密解密,【微信小程序】,最新Android面试合集

    import android.view.View; import android.widget.Button; import android.widget.EditText; import android.widget.TextView; import android.widget.Toast; import tsou.com.encryption.R; import tsou.com.encryption.base64.Base64Utils; /** 一、什么Base64算法? Base64是网络上最常见的用于传输8Bit字节代码的编码方式之一, Base64并不是安全

    2024年03月24日
    浏览(49)
  • 微信小程序路由以及跳转页面传递参数

    路由 在app.json的pages里面写 \\\"pages/页面/页面\\\" 直接保存pages直接生成非常方便  跳转页面 wx.navigateTo() 保留当前页面,跳转到应用内的某个非tabBar页面。 text bindtap=\\\"daka\\\"点击/text 会保留返回箭头 底部导航跳转在app.json写入即可 传参以及接收参数 1、本地存储 使用方法:和js差不

    2024年02月11日
    浏览(55)
  • 微信小程序路由跳转,API调用,页面传值

    wx.switchTab 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。 wx.reLaunch 关闭所有页面,打开到应用内的某个页面。 wx.redirectTo 关闭当前页面,跳转到应用内的某个页面。但是不能跳转到 tabbar 页面。 wx.navigateTo 保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面

    2024年02月12日
    浏览(45)
  • 【微信小程序】页面路由跳转函数之间的区别

    微信小程序开发系列 在开发微信小程序中基本都会用到页面跳转,微信小程序提供了几个页面跳转函数。它们之间有一些区别,试用用时需要注意,否则会达不到预期效果。下面介绍这几种页面跳转的的区别。 一共提供了五个页面跳转函数,它们都支持 Promise 风格 调用。

    2024年02月12日
    浏览(64)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包