navigator-页面链接-通过设置open-type的值来确定页面的打开方式

<view class="btn-area">
<navigator url="/page/navigate/navigate?title=navigate" hover-class="navigator-hover">跳转到新页面</navigator>
<navigator url="../../redirect/redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">在当前页打开</navigator>
<navigator url="/page/index/index" open-type="switchTab" hover-class="other-navigator-hover">切换 Tab</navigator>
<navigator target="miniProgram" open-type="navigate" app-id="" path="" extra-data="" version="release">打开绑定的小程序</navigator>
</view>

open-type 有效值

navigate 对应 wx.navigateTo 或 wx.navigateToMiniProgram 的功能
redirect 对应 wx.redirectTo 的功能
switchTab 对应 wx.switchTab 的功能
reLaunch 对应 wx.reLaunch 的功能 1.1.0
navigateBack 对应 wx.navigateBack 的功能 1.1.0
exit 退出小程序,target="miniProgram"时生效 2.1.0

重定向、转发等各种跳转的区别如下:

navigate :用于保留当前页面、跳转到应用内的某个页面,使用 wx.navigateBack可以返回到原页面。对于页面不是特别多的小程序,通常推荐使用 wx.navigateTo进行跳转, 以便返回原页面,以提高加载速度。当页面特别多时,则不推荐使用。

redirect :当页面过多时,被保留页面会挤占微信分配给小程序的内存,或是达到微信所限制的 5 层页面栈。这时,应该考虑选择 wx.redirectTo。wx.redirectTo()用于关闭当前页面,跳转到应用内的某个页面。这样的跳转,可以避免跳转前页面占据运行内存,但返回时页面需要重新加载,增加了返回页面的显示时间。

reLaunch : wx.reLaunch()与 wx.redirectTo()的用途基本相同, wx.reLaunch()先关闭了内存中所有保留的页面,再跳转到目标页面

switchTab : 对于跳转到 tab bar 的页面,最好选择 wx.switchTab(),它会先关闭所有非 tab bar 的页面。其次,也可以选择 wx.reLaunch(),它也能实现从非 tab bar 跳转到 tab bar,或在 tab bar 间跳转,效果等同 wx.switchTab()。使用其他跳转 API 来跳转到 tab bar,则会跳转失败

navigateBack: 用于关闭当前页面,并返回上一页面或多级页面。开发者可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层。这个 API 需要填写的参数只有 delta,表示要返回的页面数。若 delta 的取值大于现有可返回页面数时,则返回到用户进入小程序的第一个页面。当不填写 delta 的值时,就默认其为 1(注意,默认并非取 0),即返回上一页面。

小程序页面链接-navigator(导航)的更多相关文章

  1. 小程序开发-组件navigator导航篇

    navigator 页面链接 navigator的open-type属性 可选值 navigate.redirect.switchTab,对应于wx.navigateTo.wx.redirectTo. ...

  2. 微信小程序页面跳转导航wx.navigateTo和wx.redirectTo

    }) wx.redirectTo(OBJECT) 关闭当前页面,跳转到应用内的某个页面. 还是用上面的三张图示作为例子,当使用wx.redirctTo接口跳转页面时,原来的页面将被删除掉,当然,这是小 ...

  3. 微信小程序-页面链接

    navigator 页面链接. 注:navigator-hover默认为{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}, <navig ...

  4. 微信小程序从零开始开发步骤(二)创建小程序页面

    上一章注册完小程序,添加新建的项目,大致的准备开发已经完成,本章要分享的是 要创建一个简单的页面了,创建小程序页面的具体几个步骤: 1. 在pages 中添加一个目录 选中page,右击鼠标,从硬盘打 ...

  5. 微信小程序页面导航功能

    页面导航功能无论是在app和web中都是一个极其常见的功能,如首字母导航,tabs导航等等.但是由于微信小程序无法都dom节点进行操作,所以怎么才能在小程序中快速的导航到用户的想要到达的地方呢. 那么 ...

  6. 微信小程序页面跳转方法总结

    微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面.// 注 ...

  7. 直击--vue项目微信小程序页面跳转web-view不刷新-根源

    背景 最近项目需要适配小程序,项目是使用了vue开发的网站,其中改造方式是,每个页面都使用小程序创建一个页面通过web-view来显示指定页面的. 在没有使用小程序时,路由跳转时,刷新页面等等,这个是 ...

  8. 在微信小程序页面间传递数据总结

    在微信小程序页面间传递数据 原文链接:https://www.jianshu.com/p/dae1bac5fc75 在开发微信小程序过程之中,遇到这么一些需要在微信小程序页面之间进行数据的传递的情况, ...

  9. 测试微信小程序页面的生命周期

    前言:本人是一个初学者,也是第一次写博客,敲键盘的时候还不知道发布后是什么效果,希望内容给其他初学的同学一点帮助,同时加深自己的理解.这篇随笔讲的是Page页面的生命周期,在开发中是基础中的基础,很容 ...

随机推荐

  1. QQ在线聊天代码获取和使用教程

    在网站上挂上悬浮QQ是一种有效的推广方式,QQ正常情况下是不被允许临时会话的,需要加为好友才可以,这样很不友好, 当今每个行业都是有很多人在做,竞争很激烈,对客户的友好是增加订单的有效途径. 地址:h ...

  2. 《Programming with Objective-C》第五章 Customizing Existing Classes

    1.分类里面只新增函数,不要新增变量:虽然新增是语法合法的,但是编译器并不会为你的property合成相应的成员变量.setter和getter Categories can be used to d ...

  3. VC++ GetSafeHwnd()和GetSafeHandle()

    GetSafeHwnd()和GetSafeHandle()的主要区别: 使用者不同: (1)窗体使用:GetSafeHwnd()用于获取窗体的安全句柄(即HWND),有了HWND我们就可以方便的对HW ...

  4. 如何隐藏js

    前端好像一直会遇到js容易被查看的问题,针对这种情况,如何隐藏js呢? 突发奇想,想到一个办法,如果说一段js只需要执行一次的话 可以尝试在所有js加载操作完毕后把它去掉.看代码 <!DOCTY ...

  5. 让iOS应用支持不同版本的系统与设备

    本文转载至  http://blog.csdn.net/pucker/article/details/11980811 最近一直在做app的iOS 6和7的同时适配工作,所以在此介绍一下系统与设备的兼 ...

  6. 如何在 Linux 上录制你的终端操作

    导读 录制一个终端操作可能是一个帮助他人学习 Linux .展示一系列正确命令行操作的和分享知识的通俗易懂方法.不管是出于什么目的,从终端复制粘贴文本需要重复很多次,而录制视频的过程也是相当麻烦,有时 ...

  7. Eclipse之相关快捷键

    Eclipse的编辑功能非常强大,掌握了Eclipse快捷键功能,能够大大提高开发效率.Eclipse中有如下一些和编辑相关的快捷键.    1.[ALT+/]   此快捷键为用户编辑的好帮手,能为用 ...

  8. smarty 总结和分析

    虽然smarty现在已经废弃不用,但是它的原理我们需要了解一下,这也是TP框架的一部分原理,它把前后端分离开,这样前端只需要写静态网页,后端只需要处理数据库和php文件就可以了,phpcms的思路也大 ...

  9. Sonnet-十四行诗

    <Wish> Of our best wishes we could desire increase, That thereby rose's aroma might never die, ...

  10. synchronized和volatile的使用方法以及区别

    先看看下面的例子: public class ThreadTest { public static void main(String[] args) { final Counter counter = ...