利用clik事件触发跳转打印如下:

 jump(){this.navCtrl.push(SearchPage)}


利用tab跳转的效果如下:

利用hash跳转的效果如下

1.1 ionViewDidLoad

页面加载完成触发,这里的“加载完成”指的是页面所需的资源已经加载完成,但还没进入这个页面的状态(用户看到的还是上一个页面)。

需要注意的是它是一个很傲娇的钩子,全程只会调用一次,即第一次进入页面时被调用,此后你无论怎样进进出出它都冷冷清清凄凄惨惨戚戚不再理你了。除非你把它的后台杀了,重新进入这个软件(在网页调试的时候按刷新也是可以的)。

因此这个钩子适合你做一些一次性的处理,比如从服务器拉取用户数据存到缓存中。

1.2 ionViewWillEnte

字面意义理解就是“我要进来了”的那一刻,这个时候页面刚刚开始切换。你可以在这时对页面的数据进行预处理,这个钩子是每次都会调用的。

1.3 ionViewDidEnter

当这个钩子被触发的时候,用户已经进入到新页面了(页面处于激活状态),同样也是每次都会调用。

1.4 ionViewWillLeave

页面准备 (is about to) 离开时触发,这时用户刚刚触发了返回按钮或者相关的事件。

1.5 ionViewDidLeave

页面已经 (has finished) 离开时触发,页面处于非激活状态了。

1.6 ionViewWillUnload

页面中的资源即将被销毁时触发,此刻你是否会猜测这个钩子与ionViewDidLoad一样,只会被触发一次呢?

1:构造函数在ionViewDidLoad之前被触发
2:ionViewDidLoad只在第一次进入页面时触发
3:ionViewWillUnload会在每次离开页面后触发
4:constructor也是只会触发一次
5:前6个钩子有个共性,他们的返回值都是void,即在相应时刻调用,不会返回任何的信息。

另外两个钩子有些不太一样,它们是可以返回布尔值的ionViewCanEnter和ionViewCanLeave。统称为守卫钩子

1.7 ionViewCanEnter

1.8 ionViewCanLeave

  ionViewCanEnter(): boolean {console.log('ionViewCanEnter');// return false;    //不允许进入页面return true;    //允许进入页面}ionViewCanLeave(): boolean {console.log('ionViewCanLeave');return false;    //不允许离开页面// return true;    //允许离开页面}

作者:忠叔
链接:https://www.jianshu.com/p/72b704b5c9ed
來源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

ionic的生命周期相关推荐

  1. 来扯点ionic3[3] 页面的生命周期事件,也就是凡间所说的钩子

    首先要做一个诚挚的道歉,作为大四狗,因为升学的事情,断更两个月,所以要感谢各位仁慈的读者没有脱粉(好像也就50个粉丝).这一节,我们延续上一节制作的页面,来讨论声明周期钩子的事情. 以我的经验来看,多 ...

  2. ionic3 生命周期方法

    1.认识ionic的生命周期钩子 截至ionic 3.8.0版本,框架提供了8个钩子函数,它们分别会在页面生命周期的各个阶段被触发,我们来简单了解一下. 1.1 ionViewDidLoad 页面加载 ...

  3. Ionic生命周期与注意点

    需要注意的地方是:在走页面的生命周期以前,会先走构造方法 构造方法只走一次,除非再次创建这个页面.所以如果先push了一个新页面,然后再调用pop()返回到之前的页面,那么是不会走构造方法里面的方法的 ...

  4. ionic混合开发APP基础知识点及生命周期使用一

    导入storage app.module.ts文件 import { IonicStorageModule } from '@ionic/storage'; imports: [BrowserModu ...

  5. ionic监听android息屏和后台运行的生命周期

    Hi,宝宝们,我又来了,我最近遇到一个问题,就是在ionic中监听android的息屏.应用退出在后台运行,之后重新进入应用的事件,这个写过原生的都知道,android会在不用的时间,运行不同的生命周 ...

  6. Ionic页面的生命周期

    官方文档 如官网文档所示,常用的生命周期有如下6个: Event Desc ionViewDidLoad 当页面加载的时候触发,仅在页面创建的时候触发一次,如果被缓存了,那么下次再打开这个页面则不会触 ...

  7. ionic中关于ionicView 的生命周期

    前言 当我们来回切换页面时候,视图被缓存下来,不用每次再去new一个新的视图,可以大大地提高性能.当跳出一个视图后,视图的元素被保存在DOM中,它的作用域也就不在$watch的作用域内,当我们访问一个 ...

  8. Flutter 笔记 | Flutter 核心原理(一)架构和生命周期

    Flutter 架构 简单来讲,Flutter 从上到下可以分为三层:框架层.引擎层和嵌入层,下面我们分别介绍: 1. 框架层 Flutter Framework,即框架层.这是一个纯 Dart实现的 ...

  9. LTV 即用户生命周期价值

    20220321 https://mp.weixin.qq.com/s/kPoojfRCbvCCV4zpnCimmQ 指标计算详细介绍 数据分析|如何做好用户生命周期价值分析 LTV https:// ...

最新文章

  1. 【深度学习】ResNet的思想
  2. Core-java面试题第一套上篇
  3. linux 多线程实现倒计时,Linux用脚本实现“时分秒“倒计时功能
  4. AtCoder Beginner Contest 183 总结
  5. java的et5_Javascript与java相同的3des加密(使用etdesede/CBC/PKCS5Padding )
  6. vs code ipynb文件_UE4引擎 源码的获取、安装,以及VS配置
  7. VSCode + git 代码托管【当前没有源代码管理提供程序注册】(没有‘+’加法号) - 解决篇
  8. Magento教程 5:系统安装与备份
  9. 针对自动化测试的23种Node.js优秀实践
  10. SourceTree使用笔记 ssh-key配置
  11. 如何在VirtualBox中安装win7虚拟机?
  12. 高等数学辅导讲义_《高等数学》考研自用框架体系
  13. python输出偶数_如何用Python 判断奇偶数
  14. linux calloc
  15. ps如何把自己的图与样机结合_Ps如何套用样机图?
  16. 云原生微服务架构实战精讲第八节 访问控制与更新策略
  17. intel i5处理器layout及原理图参考
  18. java的常量和变量_JAVA-常量和变量
  19. video.js+jquery.danmu.js实现视频播放+发送弹幕
  20. 德雷福斯(Dreyfus)技能获取模型

热门文章

  1. 数字经济时代,企业上云将成为数字化转型突破口
  2. 2014中国机器视觉行业十大知名品牌
  3. 经典卷积神经网络模型 - InceptionNet
  4. 银河麒麟V10操作系统修改屏幕分辨率
  5. 金融量化交易场景下数据库如何改造?同花顺、弘源泰平真实案例分享
  6. 中荷金生有约养老年金险怎么样?好不好?
  7. 中小企业数字化转型小课堂(五)丨睿企管家-企业舆情助手
  8. ios不行安卓可以 微信签名_微信支付-支付验证签名失败(iOS)
  9. Mac安装ps软件,提示Error解决方法
  10. 用友和金蝶ERP产品私有云部署方案