离子 2 或离子 2+ 中的 ngOnInit 与 ionViewDidLoad答案

【问题标题】：ngOnInit vs ionViewDidLoad in ionic 2 or ionic 2+离子 2 或离子 2+ 中的 ngOnInit 与 ionViewDidLoad
【发布时间】：2017-09-27 22:24:50
【问题描述】：

我将使用哪一个来初始化数据，为什么？

ngOnInit() {
    this.type = 'category';
    this.getData();
    this.setData();
}

ionViewDidLoad() {
    this.type = 'category';
    this.getData();
    this.setData();
}

【问题讨论】：

标签： angular ionic2 ionic3 ionic4

【解决方案1】：

ionViewDidLoad 触发与 NavController 密切相关。

如果您需要一个独立于 NavController 呈现的组件的挂钩（并非 ionic 2 应用程序中的所有组件都是页面），您应该使用 angular lifecycle hooks 而不是 ionic navcontroller hooks。

现在，哪一个适合你，这取决于实施案例。

无论如何，所有这些钩子的名称在大多数情况下都是不言自明的。

【讨论】：

【解决方案2】：

ngOnInit 是 Angular2 调用的生命周期钩子，表示 Angular 已完成创建组件。

ionViewDidLoad 与 Ionic 的 NavController 生命周期事件有关。它在页面加载后运行。这个事件在每个页面被创建时只发生一次。

基本上两者都是初始化组件数据的好地方。

但是要使用ngOnInit，你需要实现Angular的OnInit类，另一方面，ionViewDidLoad 只能为从NavController 推送/弹出的组件定义。

所以我会说将ionViewDidLoad 用于NavController 堆栈中的组件，将ngOnInit 用于其他组件。

【讨论】：

很好的解释。谢谢。
每次刷新页面时会触发哪些生命周期事件？
优秀的答案。我想补充一下还有 ionViewWillEnter。两个 ion-page 事件之间的主要区别在于 ...WillEnter() 总是在组件呈现之前触发，而 ...DidLoad() 将不会为缓存的页面触发。 blog.ionicframework.com/navigating-lifecycle-events

【解决方案3】：

这两个函数的工作方式相同，它们在视图最初加载到 DOM 时被调用。

关于 ionic2s 生命周期挂钩的精彩博客 here。

【讨论】：