微信小程序路由介绍

最新推荐文章于 2022-08-26 17:43:38 发布
最新推荐文章于 2022-08-26 17:43:38 发布
阅读量3.4k 收藏 1
点赞数
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_60814347/article/details/126532574
版权
本文介绍了微信小程序中的路由概念和实现方式，包括启动时初始化页面、wx.navigateTo、wx.redirectTo、wx.navigateBack、<navigator>组件等跳转方法。同时详细讲解了wx.redirectTo和wx.navigateTo的区别，前者关闭页面无法回退，后者则可以返回。
摘要由CSDN通过智能技术生成

什么是路由？

路由（routing）是指分组从源到目的地时，决定端到端路径的网络范围的进程。我们可以理解微信小程序页面路由，根据路由规则（路径）从一个页面跳转到另一个页面的的规则。

一、哪些会触发页面跳转
1.小程序启动，初始化第一个页面
2.跳转新页面，调用wx.navigateTo 或者 <navigator><navigator />组件
3.页面重定向，调用wx.redirectTo 或者 <navigator><navigator />组件
4.页面返回，调用wx.navigateBack ,页面左上角返回按钮
5.wx.switchTab实现tabBar页面切换

{
    "pages": [
        "pages/index/index",
        "pages/se
最低0.47元/天 解锁文章
crush194
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序开发中的路由与页面跳转方法
wx_linying1029的博客
07-25 455
本文详细介绍了微信小程序开发中的路由与页面跳转方法，并提供了相关的代码案例。使用 switchTab 方法跳转后，原页面将被关闭，新打开的 tabBar 页面将成为当前页面。使用 navigateTo 方法跳转后，当前页面会被隐藏，新打开的页面会在原页面之上。使用 redirectTo 方法跳转后，原页面将被关闭，新打开的页面会在原页面之上。使用 reLaunch 方法跳转后，原页面将被关闭，新打开的页面会在原页面之上。在本文中，我将详细介绍微信小程序中的路由和页面跳转方法，并提供相关的代码案例。
微信小程序页面路由
sdasadasds的博客
04-20 7214
微信小程序——页面路由 什么是路由？ 路由（routing）是指分组从源到目的地时，决定端到端路径的网络范围的进程。我们可以理解微信小程序页面路由，根据路由规则（路径）从一个页面跳转到另一个页面的的规则。 一、哪些会触发页面跳转 小程序启动，初始化第一个页面 跳转新页面，调用wx.navigateTo 或者 <navigator /> 页面重定向，调用wx.redirectTo 或者 <navigator /> 页面返回，调用wx.navigateBack ,页面左上角返回按
微信小程序的路由，以及生命周期
q_qwp_p的博客
08-22 2073
微信小程序的路由，以及生命周期
微信小程序路由详解
一路坎坷的小白
08-26 529
微信小程序里对路由(页面间不同的跳转方式)的功能、用法
微信小程序——页面路由
Joyce的前端日常
10-29 668
官方文档： https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/route.html API： https://developers.weixin.qq.com/miniprogram/dev/api/route/wx.navigateBack.html ###页面栈 普通的网页在页面跳转时，页面会被刷新；而...
微信小程序的路由方法
世间万物皆不如你
09-20 300
路由 保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。 wx.navugateTo({ url:'url' }) 关闭所有页面，打开到应用内的某个页面 wx.reLaunch({ url:'url' }) 关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。 url:'url' }) 关闭当前页面，返回上一页面或多级页面。 wx.navigateBack({ //必选参数delta delta:1 //默认是1，可设置多级
js和微信小程序路由（页面）跳转拦截
03-29
在开发微信小程序时，发现官方目前并未提供相应的解决方案，根据以往的经验自己实现了路由（页面）跳转拦截。在此对两者做一个简单的对比。 vue.js的路由拦截  vue.js官方称之为导航守卫。官方文档很详细，使用起来...
微信小程序之页面拦截器
03-29
对需求进行抽象，其实要的就是一个过滤器，对小程序页面的访问进行过滤，符合条件的通过，不符合条件进行其他处理。       场景 小程序有52个页面，其中13个页面无需任何身份，另外39个页面需要系统角色。对于这...
微信小程序路由传参
weixin_48952990的博客
07-14 4168
微信小程序路由传参
微信小程序官方小程序示例源码
最新发布
12-18
微信小程序是一种轻量级的应用开发平台，由腾讯公司推出，主要针对移动端，特别是智能手机用户。它允许开发者在微信内创建并发布功能丰富的应用程序，而无需通过应用商店进行下载安装。"微信小程序官方小程序示例...
微信小程序的路由
qq_43036190的博客
06-23 915
微信小程序的路由 1、小程序路由跳转 wx.switchTab(Object object) 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面，这里的tabBar是底下的导航栏指定的页面， (Object object)参数 属性 类型 类型 必填 说明 url string 是 需要跳转的 tabBar 页面的路径 (代码包路径)（需在 app.json 的 tabBar 字段定义的页面），路径后不能带参数。 success function 否
小程序路由方式
weixin_30553777的博客
03-26 106
页面栈 框架以栈的形式维护了当前的所有页面。 当发生路由切换的时候，页面栈的表现如下： 路由方式 页面栈表现 初始化 新页面入栈 打开新页面 新页面入栈 页面重定向 当前页面出栈，新页面入栈 页面返回 页面不断出栈，直到目标返回页 Tab 切换 页面全部出栈，只留下新的 Tab 页面 重加载 页面全部出栈，只留下新的页面 类型 打开新页面，调用 API wx...
微信小程序之路由
weixin_34090643的博客
11-23 74
1. 路由方式 路由方式 触发时机 路由前页面 路由后页面 初始化 小程序打开的第一个页面 onLoad, onShow 打开新页面 调用 API wx.navigateTo 或使用组件 onHide onLoad, onShow 页面重定向 调用 API wx.redirectTo 或使用组件 onUnload onLoad, onShow 页面返回 调用 API...
小程序路由
qq_36742720的博客
12-20 409
微信小程序 路由 wx.navigateTo： 保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面。 代码： wx.navigateTo({ url: 'test?id=1' }) //test.js Page({ onLoad: function(option){ con...
微信小程序-页面路由笔记
qq_36641107的博客
07-19 271
1.路由跳转  wx.navigateTo({       url: '../logs/logs'     })   2.添加页面的时候，一定要在app.json里面添加页面路径 想要编译的时候跳在自己更改的页面上吗，就可以吧app.json里面的页面排在最前   3. 获取全局变量 App.js的最上方可以设置GlobalData的初始值。在小程序的所有页面中都可以随时调用和...
微信小程序 路由 配置怎么看
05-31
微信小程序的路由配置信息通常存储在 app.json 文件中，该文件是小程序的全局配置文件，用于配置小程序的页面路径、窗口样式、导航条样式等信息。 要查看微信小程序的路由配置信息，可以按照以下步骤操作： 1. 打开微信开发者工具，进入小程序项目 2. 在项目文件夹中找到 app.json 文件，右键选择“打开文件” 3. 在 app.json 文件中，找到 pages 数组，该数组中存储了小程序的所有页面路径，按照数组中的顺序依次展示在小程序的标签栏中 4. 如果小程序有使用 tabBar，那么 tabBar 中也会配置对应的页面路径和图标信息，需要注意这些配置信息是否正确 5. 如果小程序使用了自定义的路由，那么路由配置信息也会存储在其他配置文件中，需要根据实际情况进行查找和确认 注意：在修改微信小程序的路由配置信息时，需要注意路径是否正确，否则可能会导致路由失效，影响小程序的正常使用。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值