【微信小程序】页面导航详解

本文详细介绍了小程序中页面导航的两种方式——声明式导航和编程式导航,包括跳转tabBar页面和非tabBar页面,以及如何进行后退导航。同时,讲解了如何在导航中传递参数,并在目标页面接收这些参数。内容覆盖了导航的基础操作和实践应用。

在这里插入图片描述

🖐本节学习目标:
✅学会如何使用页面之间的导航跳转


一.页面导航

什么是页面导航

页面导航是指页面之间的相互跳转。

2.页面导航的两种实现方式

页面导航有两种实现方式:

  1. 声明式导航

方法:在页面声明一个navigator组件,通过点击这个组件来实现页面的跳转。

  1. 编程式导航

方法:调用小程序的导航API实现页面的跳转。

二.声明式导航

1.导航到tabBar页面

tab页面指被配置为tabBar的页面,在使用指定navigator组件跳转到指定页面时,必需要指定url属性和open-style属性,其中:

  • url表示要跳转的页面地址,必须以/开头
  • open-strle表示跳转的方式,这里必须是switchTab
<navigator url="/pages/message/message" open-type="switchTab">跳转到消息页面</navigator>

在这里插入图片描述

2.导航到非tabBar页面

非tabBar页面指的是没有被配置为tabBar的页面。在使用naxigator组件跳转到非tabBar页面时,也需要指定url属性和open-type属性,其中:

  • url表示要跳转的页面地址,必须以/开头
  • open-style表示跳转的方式,这里必须是navigate,此时这个属性可以省略
<navigator url="/pages/info/info" open-type="navigate">跳转到info页面</navigator>

评论 134
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

橙 子_

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值