小程序开发中必不可少的组件navigator,虽然使用频率非常高,但是却没多少人能灵活运用。

先说navigator组件的用处

它的主要用处是跳转执行,跳转可分为当前页面内跳转、前往页面外部的跳转。

其中,在官方文档中有明确示例:

<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>

这些功能涵盖了navigator的常用功能。

但是有时候跳转效果达不到我们想要的怎么办,将navigator的组件换成正常的view标签,加上***bindtap***来执行跳转,只是用了bindtap跳转后就会失去navigator的优势,比如打开速度等等。

navigator跳转除了url上有不明显的区别外,在open-type上各有区别,这里的open-type和view中的bindtap异曲同工

小程序导航组件navigator活学活用的更多相关文章

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

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

  2. 「小程序JAVA实战」小程序导航组件(26)

    转自:https://idig8.com/2018/08/19/xiaochengxujavashizhanxiaochengxudaohangzujian26/ 来说下 ,小程序的导航组件.源码:h ...

  3. 微信小程序的组件总结

    本文介绍微信小程序的组件 视图容器 基础内容 表单组件 导航组件 媒体组件 视图容器 view 布局容器 <view hover-class='bg'>222</view> 可 ...

  4. 微信小程序-导航 & 路由

    微信小程序-导航 & 路由 页面跳转 页面路由 页面栈, 框架以栈的形式维护了当前的所有页面. https://developers.weixin.qq.com/miniprogram/dev ...

  5. 微信小程序导航:官方工具+精品教程+DEMO集合(1月7更新)

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug ...

  6. 自定义微信小程序导航(兼容各种手机)

    详细代码请见github,请点击地址,其中有原生小程序的实现,也有wepy版本的实现 了解小程序默认导航 如上图所示,微信导航分为两部分,第一个部分为statusBarHeight,刘海屏手机(iPh ...

  7. JVM活学活用——调优工具

    概述 工具做为图形化界面来展示更能直观的发现问题,另一方面一些耗费性能的分析(dump文件分析)一般也不会在生产直接分析,往往dump下来的文件达1G左右,人工分析效率较低,因此利用工具来分析jvm相 ...

  8. HTML5--details活学活用

    这是补充HTML5基础知识的系列内容,其他为: 一.HTML5-- 新的结构元素 二.HTML5-- figure.time.details.mark 三.HTML5-- details活学活用 四. ...

  9. 推荐3个小程序开源组件库——Vant、iView、ColorUI

    推荐3个小程序开源组件库 在进行小程序开发时,经常会遇到编写组件方面的阻碍,这让我们花费大量的时间在页面以及 CSS 样式编写上.因此可以使用开源组件库,有些复杂的组件可以直接拿来使用,节省开发时间, ...

随机推荐

  1. nodejs的POST两种type类型提交(原生)

    POST数据的两种提交格式 application/x-www-form-urlencoded(上传数据中没有文件) multipart/form-data (文件上传) 获取POST数据,post数 ...

  2. sourceTree的忽略文件

    在没有导入项目之前,就要把忽略配置好: *~ .DS_Store xcuserdata

  3. Cosmetic Sprayer Structure Anatomy

    What shape of spray is sprayed by the cosmetic spray pump head?     Plastic Sprayers Manufacturer   ...

  4. GSS系列题解——最大子段和系列

    开坑啦! 2019 3/28 以前一直不知道怎么搞最大子段和,如今终于可以学习,其实真的很简单啊. 2019 3/29 树链剖分上最大子段和也OK啦 前置技能:线段树 题目大意:询问区间[l,r]的最 ...

  5. ubuntu13.10安装tomcat

    步骤: ubuntu :13.10(32bit) -->i586 jdk 1.7 安装JDK 步骤: 1.官网下载如下图: 2.点击java SE7,下载jdk1.7 3.点击接受,并下载对应的 ...

  6. eclipse 快速隐藏所有方法的代码块

    java开发中往往一个class文件中会有很多方法,一个方法的实现代码有时候特别长 我个人就喜欢把无关的方法代码全部隐藏起来,只打开当前需要编辑的代码就行了(不喜欢看导航视图,容易头晕) Ctrl+s ...

  7. c++11的记录

    decltype()类型指示符 设定一个返回值是int的函数f(),通过使用 decltype(f()) sum = x; 此时decltype()接受一个从f()返回的int型的值,并将sum设置为 ...

  8. 学习笔记(2)- BioBERT

    Jinhyuk Lee, Wonjin Yoon, Sungdong Kim, Donghyeon Kim, Sunkyu Kim, Chan Ho So, Jaewoo Kang, BioBERT: ...

  9. 超参数 hyperparameters

    转载:https://www.cnblogs.com/qamra/p/8721561.html 超参数的定义:在机器学习的上下文中,超参数是在开始学习过程之前设置值的参数,而不是通过训练得到的参数数据 ...

  10. intelliJ IDEA 全屏键盘手

    从MyEclipse到IntelliJ IDEA --让你脱键盘,全键盘操作 从MyEclipse转战到IntelliJ IDEA的经历 我一个朋友写了一篇"从Eclipse到Android ...