小程序 - 页面跳转 扒一扒

原创 uptown 教程 小程序 75阅读 15 天前 举报

       刚接触小程序时,看到这 4 个单词:reLaunch、switchTab、redirectTo、navigateTo,都有类似跳转的感觉,但随便拿一个出来用,都有种看韩国选美比赛,指着其中一个,问你叫什么名字的感觉。个人的习惯是,首字母联想记忆,这四个跳转的首字母,分别是,R、S、R、N,我记忆成:认识RN,小程序的页面标签,不就是 RN 那一套嘛!这个方法,比较容易形成永久记忆!而且,这个四个单词都是驼峰命名!

     提示:about.wxml 是导航页面,demo.wxml 是非导航页面,微信小程序版本是:1.02

     主要从页面跳转是否导航页,可否传递参数,是否带返回按钮 3 个方面进行测试。

1、reLaunch 重启

跳转支持:导航页、非导航页,可传参

跳转的页面,不带返回按钮

2、switchTab 切换标签

跳转支持:只支持导航页,不支持传参,页面会提醒:wx.switchTab: url 不支持 queryString

跳转的页面,不带返回按钮

3、redirectTo  重定向

跳转支持:只支持 非导航页,支持传参

跳转的页面,不带返回按钮

4、navigateTo 导航到

跳转支持:只支持 非导航页,支持传参;也就是跟 redirectTo 一样,但是:

带返回按钮  “<”,唯一的!

5、navigateBack

测试过程中,暂时只有通过 navigateTo 方式 跳转的页面,navigateBack 才会返回原页面,且不支持回传参数!

 用例 6 的 <navigator> 也是一样的。

* 6、<navigator>

发现 跟 navigateTo  效果一样:只支持非导航页,能传参,跳转的页面,还带熟悉的返回按钮 “>”

其实,是因为 <navigator> 有个的属性 open-type,刚好他的默认值是:navigate,也就等同于:navigateTo

open-type 属性值:reLaunch |  switchTab |  redirect | navigate | navigateBack | exit

显而易见,这些属性,分别对等于上面例中的 reLaunch 、switchTab 、redirectTo、navigateTo、navigateBack;

exit 暂时无效,官网显示是 2.1 版本 

ps:以上范例中,demo.wxml、about.wxml 页面接收参数:

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复