Ionic 3 组件与页面

Question

你能告诉我

Component

应用程序中的

Page

和

Ionic 3

生成器有什么区别吗？看来我也可以在组件内部使用像

ionViewWillLeave

这样的页面生命周期钩子。那么我什么时候应该使用角度生命周期钩子呢？如果相同那么为什么它有 2 个发电机？希望您能对此提供反馈。

组件生成器：

 ionic generate component SubscribeTopicComponent

页面生成器：

ionic generate page LoginPage

Answer 1

根据评论中的对话：

从 Angular 的角度来看可能是一样的，但是 Pages 和 Components 在 Ionic 中有不同的含义。 就 Angular 而言，两者都只是组件，但是在 Ionic 的上下文中，Page 是一个组件，它将充当 整个视图（它可能具有嵌套组件）；我们将 Ionic 页面视为一个独立的概念。大多数时候，在 Angular 应用程序中，组件只是更大组件的一部分，所以我想这是与 Pages 最大的区别。

关于使用 Angular 的生命周期钩子，我喜欢在嵌套组件中使用它们，但在页面上工作时我更喜欢 Ionic 生命周期钩子。主要是因为像

ionViewWillEnter

这样的东西在简单组件的上下文中没有太大意义，而

ngOnInit

则有意义。话虽这么说，我还在页面上使用了一些 Angular 生命周期钩子，例如

ngOnDestroy

（当页面将被销毁时，我用它来删除该页面中的所有订阅），但就像你说的，

ionViewWillUnload

如果我们想使用 Ionic 的生命周期钩子，这似乎是正确的方法。

我猜大多数的Ionic生命周期钩子与用户与整个页面交互的方式更相关（将进入页面，将从页面离开，可以进入页面，可以离开来自页面...）而 Angular 生命周期钩子与单个组件生命周期的不同阶段更相关（输入已初始化，更改检测器已检查此组件中是否有更改，... ），正如您所看到的，这可能根本与用户交互没有直接关系，并且通常是用户不知道的事情。

我很确定没有规定哪种方法更好，但最重要的是一致性。 我认为在页面组件中使用 Ionic 生命周期钩子，并在嵌套组件中使用 Angular 生命周期钩子是有意义的，但是您可以使用不同的方法，只要在整个应用程序中一致地执行即可。

Answer 2

有两个独立的生成器，因为添加了一个额外的装饰器到 ionic：@IonicPage

这个装饰器比简单的组件有一些优点。

1. 路由 - 您可以指定页面的 url 是什么、如何到达那里以及其默认历史记录是什么。这样您就可以直接访问任何页面，而无需通过导航路径。到此页面的路由也可以使用字符串而不是实际的组件来完成

2. 延迟加载 - 具有此装饰器的页面模块在访问页面的 url 时将默认延迟加载。

3. 没有应用程序模块依赖 - 这更多是个人最喜欢的，但是当您创建页面模块时，您不必将它们添加到原始 ngModule 中，并且这是在编译时自动完成的。

更多文档： https://ionicframework.com/docs/api/navigation/IonicPage/

Answer 3

我认为新版本的 ionic 中最重要的区别至少是在生成页面时包含一个模块文件，该文件允许在页面中概念性地集成其他组件，而组件 ionic 则不会生成 html、css、 ts 文件；