diff --git a/docs/angular/lifecycle.md b/docs/angular/lifecycle.md index 09206bdf137..5bf7d113370 100644 --- a/docs/angular/lifecycle.md +++ b/docs/angular/lifecycle.md @@ -41,6 +41,8 @@ In addition to the Angular life cycle events, Ionic Angular provides a few addit | `ionViewWillLeave` | Fired when the component routing from is about to animate. | | `ionViewDidLeave` | Fired when the component routing to has finished animating. | +These lifecycles are only called on components directly mapped by a router. This means if `/pageOne` maps to `PageOneComponent`, then Ionic lifecycles will be called on `PageOneComponent` but will not be called on any child components that `PageOneComponent` may render. + The difference between `ionViewWillEnter` and `ionViewDidEnter` is when they fire. The former fires right after `ngOnInit` but before the page transition begins, and the latter directly after the transition ends. For `ionViewWillLeave` and `ionViewDidLeave`, `ionViewWillLeave` gets called directly before the transition away from the current page begins, and `ionViewDidLeave` does not get called until after the new page gets successfully transitioned into (after the new pages `ionViewDidEnter` fires). diff --git a/docs/react/lifecycle.md b/docs/react/lifecycle.md index 13458ad97ba..aba6783e34b 100644 --- a/docs/react/lifecycle.md +++ b/docs/react/lifecycle.md @@ -24,6 +24,8 @@ Ionic provides a few lifecycle methods that you can use in your apps: | `ionViewWillLeave` | Fired when the component routing from is about to animate. | | `ionViewDidLeave` | Fired when the component routing to has finished animating. | +These lifecycles are only called on components directly mapped by a router. This means if `/pageOne` maps to `PageOneComponent`, then Ionic lifecycles will be called on `PageOneComponent` but will not be called on any child components that `PageOneComponent` may render. + The way you access these methods varies based on if you are using class-based components or functional components. We cover both methods below. ## Lifecycle Methods in Class-Based Components diff --git a/docs/vue/lifecycle.md b/docs/vue/lifecycle.md index 1c7b70ea460..a36def3597a 100644 --- a/docs/vue/lifecycle.md +++ b/docs/vue/lifecycle.md @@ -17,6 +17,8 @@ Ionic Framework provides a few lifecycle methods that you can use in your apps: | `ionViewWillLeave` | Fired when the component routing from is about to animate. | | `ionViewDidLeave` | Fired when the component routing to has finished animating. | +These lifecycles are only called on components directly mapped by a router. This means if `/pageOne` maps to `PageOneComponent`, then Ionic lifecycles will be called on `PageOneComponent` but will not be called on any child components that `PageOneComponent` may render. + The lifecycles are defined the same way Vue lifecycle methods are - as functions at the root of your Vue component: ```tsx diff --git a/versioned_docs/version-v6/angular/lifecycle.md b/versioned_docs/version-v6/angular/lifecycle.md index 09206bdf137..5bf7d113370 100644 --- a/versioned_docs/version-v6/angular/lifecycle.md +++ b/versioned_docs/version-v6/angular/lifecycle.md @@ -41,6 +41,8 @@ In addition to the Angular life cycle events, Ionic Angular provides a few addit | `ionViewWillLeave` | Fired when the component routing from is about to animate. | | `ionViewDidLeave` | Fired when the component routing to has finished animating. | +These lifecycles are only called on components directly mapped by a router. This means if `/pageOne` maps to `PageOneComponent`, then Ionic lifecycles will be called on `PageOneComponent` but will not be called on any child components that `PageOneComponent` may render. + The difference between `ionViewWillEnter` and `ionViewDidEnter` is when they fire. The former fires right after `ngOnInit` but before the page transition begins, and the latter directly after the transition ends. For `ionViewWillLeave` and `ionViewDidLeave`, `ionViewWillLeave` gets called directly before the transition away from the current page begins, and `ionViewDidLeave` does not get called until after the new page gets successfully transitioned into (after the new pages `ionViewDidEnter` fires). diff --git a/versioned_docs/version-v6/react/lifecycle.md b/versioned_docs/version-v6/react/lifecycle.md index 13458ad97ba..aba6783e34b 100644 --- a/versioned_docs/version-v6/react/lifecycle.md +++ b/versioned_docs/version-v6/react/lifecycle.md @@ -24,6 +24,8 @@ Ionic provides a few lifecycle methods that you can use in your apps: | `ionViewWillLeave` | Fired when the component routing from is about to animate. | | `ionViewDidLeave` | Fired when the component routing to has finished animating. | +These lifecycles are only called on components directly mapped by a router. This means if `/pageOne` maps to `PageOneComponent`, then Ionic lifecycles will be called on `PageOneComponent` but will not be called on any child components that `PageOneComponent` may render. + The way you access these methods varies based on if you are using class-based components or functional components. We cover both methods below. ## Lifecycle Methods in Class-Based Components diff --git a/versioned_docs/version-v6/vue/lifecycle.md b/versioned_docs/version-v6/vue/lifecycle.md index 1c7b70ea460..a36def3597a 100644 --- a/versioned_docs/version-v6/vue/lifecycle.md +++ b/versioned_docs/version-v6/vue/lifecycle.md @@ -17,6 +17,8 @@ Ionic Framework provides a few lifecycle methods that you can use in your apps: | `ionViewWillLeave` | Fired when the component routing from is about to animate. | | `ionViewDidLeave` | Fired when the component routing to has finished animating. | +These lifecycles are only called on components directly mapped by a router. This means if `/pageOne` maps to `PageOneComponent`, then Ionic lifecycles will be called on `PageOneComponent` but will not be called on any child components that `PageOneComponent` may render. + The lifecycles are defined the same way Vue lifecycle methods are - as functions at the root of your Vue component: ```tsx