微信小程序开发:学习笔记[8]——页面跳转及传参
微信小程序开发:学习笔记[8]——页面跳转及传参
页面跳转
一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面。在首页使用2次wx.navigateTo后,页面层级会有三层,我们把这样的一个页面层级称为页面栈。

后续为了表述方便,我们采用这样的方式进行描述页面栈:[ pageA, pageB, pageC ],其中pageA在最底下,pageC在最顶上,也就是用户所看到的界面,需要注意在本书编写的时候,小程序宿主环境限制了这个页面栈的最大层级为10层 ,也就是当页面栈到达10层之后就没有办法再推入新的页面了。我们下面来通过上边这个页面栈描述以下几个和导航相关的API。
- 使用 wx.navigateTo({ url: 'pageD' }) 可以往当前页面栈多推入一个 pageD,此时页面栈变成 [ pageA, pageB, pageC, pageD ]。
- 使用 wx.navigateBack() 可以退出当前页面栈的最顶上页面,此时页面栈变成 [ pageA, pageB, pageC ]。
- 使用wx.redirectTo({ url: 'pageE' }) 是替换当前页变成pageE,此时页面栈变成 [ pageA, pageB, pageE ],当页面栈到达10层没法再新增的时候,往往就是使用redirectTo这个API进行页面跳转。
如果要跳转的位置是否位于TabBar中,如果是的话,要使用wx.switchTab 来跳转界面:

页面传参
第一步:调用Navigator进行页面跳转时携带参数

第二步:在新页面接受参数

第三步:在新页面显示参数

微信小程序开发:学习笔记[8]——页面跳转及传参的更多相关文章
- 第1-5章 慕课网微信小程序开发学习笔记
第1章 前言:不同的时代,不同的Web --微信小程序商城构建全栈应用 http://note.youdao.com/noteshare?id=a0e9b058853dbccf886c1a890594 ...
- 第6章 AOP与全局异常处理6.5-6.11 慕课网微信小程序开发学习笔记
https://coding.imooc.com/learn/list/97.html 目录: 第6章 AOP与全局异常处理6-1 正确理解异常处理流程 13:236-2 固有的处理异常的思维模式与流 ...
- 第6章 AOP与全局异常处理6.1-6.4 慕课网微信小程序开发学习笔记
第6章 AOP与全局异常处理 https://coding.imooc.com/learn/list/97.html 目录: 第6章 AOP与全局异常处理6-1 正确理解异常处理流程 13:236-2 ...
- 第7章 数据库访问与ORM 慕课网微信小程序开发学习笔记
第7章 数据库访问与ORM https://coding.imooc.com/learn/list/97.html 目录: 7-1 数据库操作三种方式之原生SQL 19:09 7-2 从一个错误了解E ...
- 微信小程序开发(四)页面跳转
承接上篇博客. 通过点击按钮跳转到新的页面. 先创建新页面home: 代码如下: // home.js Page({}) // 注册页面 // home.json {} // home.wxml &l ...
- 微信小程序开发学习资料
作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- 微信小程序开发06-一个业务页面的完成
前言 接上文:微信小程序开发05-日历组件的实现 github地址:https://github.com/yexiaochai/wxdemo 这里来说一说我们的理念,我们也学习小程序开发有一周多了,从 ...
- 微信小程序视频学习笔记
[清华大学]学做小程序 https://www.bilibili.com/video/av21987398 2.2创建项目和文件结构 小程序包含一个描述整体程序的app和多个描述各自页面的page 配 ...
- 微信小程序开发学习(一):开发前准备
开发前准备 Step1:注册 微信小程序开放平台: https://mp.weixin.qq.com/cgi-bin/wx 开发者注册: https://mp.weixin.qq.com/wxopen ...
随机推荐
- Oracle For 循环添加数据
自己亲自使用的,绝对OK --添加数据declare i number; --用for实现 begin for i in 0 .. 500 loop insert into cust(custsn,t ...
- delphi中关于时间差的实例
http://www.cnblogs.com/rogee/archive/2010/09/20/1832035.html 很多时候要用到相差多少天,多少周,多少秒,查了一下资料,整理如下: 首先 us ...
- js拖拽效果的实现
1.最基础的写法 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> < ...
- Codeforces Gym101606 I.I Work All Day (2017 United Kingdom and Ireland Programming Contest (UKIEPC 2017))
I I Work All Day 这个题就是取模找最小的. 代码: 1 #include<iostream> 2 #include<cstdio> 3 #include< ...
- 牛客网 牛客练习赛7 D. 珂朵莉的无向图(多源BFS)
题目链接 Problem D 比赛的时候完全想不到 直接对给定的这些点做多源$BFS$,把给定的这些点全都压到队列里,然后一个个做. 最后统计被访问的点的个数即可. #include <bit ...
- Java1.8新特性——接口改动和Lambda表达式
Java1.8新特性——接口改动和Lambda表达式 摘要:本文主要学习了Java1.8的新特性中有关接口和Lambda表达式的部分. 部分内容来自以下博客: https://www.cnblogs. ...
- C# Ftp Client 基本操作
C# Ftp Client 上传.下载与删除 简单介绍一下Ftp Client 上传.下载与删除,这是目前比较常用的命令,各个方法其实都差不多,重点是了解Ftp命令协议. 1.建立连接 public ...
- 邁向IT專家成功之路的三十則鐵律 鐵律三十 IT人成功之道-總結
時間過得相當快!很榮幸有這個機會能夠在iT邦幫忙鐵人賽的社群網站上,和所有IT人分享「邁向IT專家成功之路的三十則鐵律」,其主要目的只是單純希望每一位辛苦的IT工作者,盡可能可以從這一些經驗分享中,將 ...
- gitignore 规则
在使用git的过程中,总有一些我们不想被跟踪的文件,例如vim的交换文件,编译产生的文件等等.这时,我们可以在项目的根目录下创建一个名为 .gitignore 的文件,列出不想被跟踪的文件模式即可.下 ...
- JS里面的call, apply以及bind
参考了这篇文章:http://www.tuicool.com/articles/EVF3Eb 给几个例子 function add(a,b) { alert(a+b); } function sub( ...