小编在公司新接触了一个项目,然后客户想要手机端的项目,然后项目组长提议前端用Ionic 。一听是新的框架,小编来了兴趣,那现在就带大家入门一下吧。啥也不多说,直接上图吧!
上图圆圈中就是监听事件来管理页面的声明周期的,在Ionic中用到的监听事件,下面具体解释一下!
- ionViewDidLoad:页面已加载! 这个事件是当视图已经存放在内存时才进行启动项目,但是如果已经进入缓存的视图不会触发这个事件。这也是一个很好的方式初始化被关联的视图或者页面;
- ionViewDidEnter: 已经进入页面!未加载完成!进入页面后,在成为活动页面后启动。与前一个非常相似。
ionViewDidLeave: 已经离开页面!:当你离开一个页面,在它停止成为活动页面之后。与前一个相似。
ionViewWillUnload: 将要销毁!:当视图将被完全删除(在离开非缓存视图之后)。
ionViewCanEnter: 允许进入 :在进入视图之前启动,允许控制视图是否可以访问;返回ture或者false。
**ionViewCanLeave:允许离开::在离开视图,允许去控制是否离开;
举个栗子,方便大家理解:
export class MusicPage {
/* ...some stuff ...*/
/* lifecycle events */
ionViewDidLoad() { 这就能获取到事件了
let audioFile = this.params.get('audio');
this.music = new howler.Howl({ src: [`assets/music/${audioFile}.mp3`]});
this.image = `assets/img/${audioFile}.jpg`;
}
//TODO: add lifecycle events to play, pause and stop audio
/* end lifecycle events */
}