Vue.js - Routing mit Vue-Router

Ziele

"Der Kurs 'Routing in Vue.js mit Vue-Router' bietet eine Anleitung zur Implementierung von effizientem Routing in Vue.js-Anwendungen. Zunächst werden die Grundlagen von Vue.js und die Einrichtung von Vue-Router behandelt. Anschließend liegt der Fokus auf der Entwicklung von Routen und der Anzeige unterschiedlicher Komponenten je nach aktueller Route. Abschließend werden fortgeschrittene Themen wie verschachtelte Routen, benannte Routen und benannte Routenzonen detailliert erläutert."

Zielgruppe

Web-Entwickler

Voraussetzungen

Solide Vue.js Kenntnisse

Agenda

Einführung

• Was ist Vue-Router?
• Kernkonzepte von Vue-Router

Erste Schritte

• Installation der Vue-Router Bibliothek
• Erstellen der ersten Route
• Hinzufügen einer Router-View Komponente

Route Grundlagen

• Verwendung dynamischer Route Parameter
• Übergabe von Routing-Parametern als Component Props
• Nesting routes
• Programmgesteuert navigieren
• Verwendung von Router-Link-Komponenten
• Benennung von Routes

Zwischengeschaltete Routing-Techniken

• Steuerung mehrerer Komponenten mit bezeichneten Router-Ansichten
• Verwendung von redirects
• Verwendung von route aliases
• Wechsel der Routing-Modi (Hashes vs. History-API)

Fortgeschrittenes Routing

• Verwendung von Navigationskontrollen, um den Zugang zu Routen zu beschränken
• Verwendung von Routen-Metadaten
• Reibungslose Übergänge zwischen Komponenten beim Routenwechsel
• Durchführen asynchroner Operations zwischen Routen
• Zurücksetzen der Scrollposition beim Navigieren durch den Verlauf
• Lazy loading von Routenkomponenten