微信小程序笔记<五> 页面管理及生命周期(route)——getCurrentPages()

时间:2022-09-17 22:21:36
在小程序中所有页面的路由全部由框架进行管理,而框架以栈的形式维护了当前的所有页面。
当发生路由切换时,页面栈的表现:
微信小程序笔记<五> 页面管理及生命周期(route)——getCurrentPages()
getCurrentPages() 用于获取当前页面栈的实例,可以把 getCurrentPages() 看做当前小程序所有页面的集合。该集合的第一个元素为首页,最后一个元素为当前页。
ps:不要尝试修改页面栈,会导致路由以及页面状态错误。
// index/index.js ================================
Page({
data:{"id":1,"name":"mirage"},
onShow:function(){
console.log(getCurrentPages().length); // 输出 1
console.log(getCurrentPages()[0].data);
// 输出 {id: 1, name: "mirage", __webviewId__: 24}
console.log(getCurrentPages()[1]);
// undefined
},
goto:function(){
wx.navigateTo({
url: "../info/info"
})
}
}) // info/info.js ==================================
Page({
data: { "id": 2, "name": "fox"},
onLoad: function (req) {
console.log(getCurrentPages().length); // 输出 2
console.log(getCurrentPages()[0].data);
// {id: 1, name: "mirage", __webviewId__: 28}
console.log(getCurrentPages()[1].data);
// {id: 2, name: "fox", __webviewId__: 29}
}
})

getCurrentPages() 可以获取小程序中每个页面的Page实例。

Page() 中 data 输出的 __webviewId__ 每次打开页面该值为0,每当页面重新加载 __webviewId__ 值 +1,且该值不可被手动修改。所以 __webviewId__  可以查看页面被加载的次数。

以下是官方提供的路由的触发方式以及页面生命周期函数表

微信小程序笔记<五> 页面管理及生命周期(route)——getCurrentPages()

关于 Tab 切换对应的页面生命周期;

案例场景  ==>  A、B 页面为 Tabbar 页面,C 是从 A 页面打开的页面,D 页面是从 C 页面打开的页面;

微信小程序笔记<五> 页面管理及生命周期(route)——getCurrentPages()

注意:

  1. navigateTo, redirectTo 只能打开非 tabBar 页面。
  2. switchTab 只能打开 tabBar 页面。
  3. reLaunch 可以打开任意页面。
  4. 页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有 tabBar。
  5. 调用页面路由带的参数可以在目标页面的onLoad中获取。
 

微信小程序笔记<五> 页面管理及生命周期(route)——getCurrentPages()的更多相关文章

  1. 【微信小程序开发•系列文章六】生命周期和路由

    这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...

  2. 微信小程序把玩(四)应用生命周期

    原文:微信小程序把玩(四)应用生命周期 App() 函数用来注册一个小程序,注意必须在 app.js 中注册,且不能注册多个. 使用方式也跟Android中的Application中初始化一些全局信息 ...

  3. 微信小程序 项目实战(一)生命周期 配置服务器信息 splash启动页

    步骤一:小程序 生命周期 //app.js App({ onLaunch: function () { //当小程序初始化完成时,会触发onLaunch(全局只触发一次) }, onShow: fun ...

  4. Java Web项目,Android和微信小程序的初始页面配置

    Java Web项目 我们在Eclipse里开了Java Web项目之后,Run As Tomcat或者Apache服务器,本地运行,如果直接用http://localhost:8080访问项目,会发 ...

  5. (十二)微信小程序实现登陆页面&plus;登陆逻辑

    微信小程序实现登陆页面 实现上面两个页面 第一个页面 <view> <!-- 上侧部分 --> <view class="top-view"> ...

  6. 完整微信小程序授权登录页面教程

    完整微信小程序授权登录页面教程 1.前言 微信官方对getUserInfo接口做了修改,授权窗口无法直接弹出,而取而代之是需要创建一个button,将其open-type属性绑定getUseInfo方 ...

  7. 微信小程序笔记&lt&semi;四&gt&semi;page&period;js —— 页面注册

    小程序的每个页面都是独立的,每个页面都必须有 page.js 和 page.wxhl 文件,page.json 和 page.wxss 文件非必要文件,注意如果创建 page.json 则至少保证有一 ...

  8. 微信小程序详解——页面之间的跳转方式【路由】和参数传递

    微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能.今天我们来研究小程序页面之间的跳转方式. 1.先导 在Andr ...

  9. 微信小程序从子页面退回父页面时的数据传递 wx&period;navigateBack&lpar;&rpar;

    我们知道,在微信小程序中,从一个页面转到另一个页面,一般情况下可以通过navigate或redirect时候的url来携带参数,然后在目标页面的onLoad函数参数中获取这些url参数.例如: // ...

随机推荐

  1. css中,设置百分比后,让百分比的宽度包括padding和border来计算

    *{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

  2. Money类型转化为String去除小数点后0解决方法

    Money类型转化为String去除小数点后0从数据库提取Money类型后,字符串如:1212.0000 如何使其成为1212             注:去掉了小数点 如果是:1212.0100 使 ...

  3. easyui里弹窗的两种表现形式

    easyui里弹窗的两种表现形式 博客分类: jQueryEasyUi   1.主JSP页面中描绘弹窗   <div id="centerDiv" data-options= ...

  4. Python&colon;安装mssql模块功能,并实现与sqlserver连接、查询

    由于我系统是x64系统,所以下载python2.7 x64.下载地址:https://www.python.org/downloads/release/python-2712/, 经过测试发现这个版本 ...

  5. NSData和NSString 、 NSFileManager

    1 NSData和NSMutableData的基本使用 1.1 问题 NSData类是IOS提供的用于以二进制的形式操作文件数据的类,NSData有两个常用的属性length和bytes,length ...

  6. JS滚动加载

    var one = true;//设置一个全局变量 $(window).scroll(function () { var hight = document.body.scrollHeight - do ...

  7. 异常-----Can&&num;39&semi;t convert the date to string&comma; because it is not known which parts of the date variable are in use&period; Use &quest;date&comma; &quest;time or &quest;datetime built-in&comma; or &quest;string&period;&bsol;u003Cformat&gt&semi; or &quest;string&lpar;format&rpar; built-

    1.错误描述 五月 27, 2014 12:07:05 上午 freemarker.log.JDK14LoggerFactory$JDK14Logger error 严重: Template proc ...

  8. js中级6

    1.动画 (1)Css样式提供了运动 过渡属性transition  从一种情况到另一种情况叫过渡 transition:time          linear                 de ...

  9. 47&lowbar;并发编程-线程python实现

    一.Threading模块   1.线程的创建 - 方式一 from threading import Thread import time def sayhi(name): time.sleep(2 ...

  10. 6-7 树的层次遍历 uva122

    非常不熟练  照着书大的 晚上尝试一下自己打  了解二叉树  用数组打 第一次: #include<bits/stdc++.h> using namespace std; bool fai ...