Navigation Lifecycle
Now that you understand Renderers and Transitions, how does it all fit together?
Let's use a real world example to find out:
- A user clicks a link in your app
- Taxi will go and fetch the new page the user has requested, and attach it to the current Document so images etc start downloading
- Taxi checks to see which Transition should be used
- The current Renderer's
onLeave
method is called - Then the chosen Transition's
onLeave
.
The old page content is removed here unless you setremoveOldContent: false
when initing Taxi. - Then the Renderer's
onLeaveCompleted
- Next, Taxi will add the new page's content to the container
- Taxi will look at the new page content and call the
onEnter
method of the Renderer set via the new page'sdata-taxi-view
attribute, or the default if not defined - Then call the Transition's
onEnter
method - Finally, when the transition is all finished, the new Renderer's
onEnterComplete
is called
What's next: