docs: add 8 more Vue School links (#1317)

diff --git a/docs/guide/advanced/dynamic-routing.md b/docs/guide/advanced/dynamic-routing.md
index 440cc845cb5bd3d18a4be7231c31287e7c755a62..6b0e49fddb96ddb544bf08968bea6330a4cbdd8f 100644 (file)
--- a/docs/guide/advanced/dynamic-routing.md
+++ b/docs/guide/advanced/dynamic-routing.md
@@ -1,5 +1,10 @@
 # Dynamic Routing
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/vue-router-4-dynamic-routing"
+  title="Learn how to add routes at runtime"
+/>
+
 Adding routes to your router is usually done via the [`routes` option](../../api/#routes) but in some situations, you might want to add or remove routes while the application is already running. Application with extensible interfaces like [Vue CLI UI](https://cli.vuejs.org/dev-guide/ui-api.html) can use this to make the application grow.
 
 ## Adding Routes

diff --git a/docs/guide/advanced/navigation-failures.md b/docs/guide/advanced/navigation-failures.md
index ebca458507dec81af8bd01ea490b43aa6acc3191..28b2db4841fb17e87c03a9267e876d537cf78b93 100644 (file)
--- a/docs/guide/advanced/navigation-failures.md
+++ b/docs/guide/advanced/navigation-failures.md
@@ -1,5 +1,10 @@
 # Waiting for the result of a Navigation
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/vue-router-4-detecting-navigation-failures"
+  title="Learn how to detect navigation failures"
+/>
+
 When using `router-link`, Vue Router calls `router.push` to trigger a navigation. While the expected behavior for most links is to navigate a user to a new page, there are a few situations where users will remain on the same page:
 
 - Users are already on the page that they are trying to navigate to.

diff --git a/docs/guide/advanced/navigation-guards.md b/docs/guide/advanced/navigation-guards.md
index ec1ed61e086b707199d4332aba28d6cecefc76ea..04fe4d63d23c4801b25ce00495f4c700c54349eb 100644 (file)
--- a/docs/guide/advanced/navigation-guards.md
+++ b/docs/guide/advanced/navigation-guards.md
@@ -1,5 +1,10 @@
 # Navigation Guards
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/route-guards"
+  title="Learn how to add navigation guards"
+/>
+
 As the name suggests, the navigation guards provided by Vue router are primarily used to guard navigations either by redirecting it or canceling it. There are a number of ways to hook into the route navigation process: globally, per-route, or in-component.
 
 ## Global Before Guards

diff --git a/docs/guide/essentials/named-views.md b/docs/guide/essentials/named-views.md
index 0fc6f0ae2c2ab13799ff3b04412fd1e76c5f8f4a..f86044799b5369d7128d46be96ef2bed6a989c89 100644 (file)
--- a/docs/guide/essentials/named-views.md
+++ b/docs/guide/essentials/named-views.md
@@ -1,5 +1,10 @@
 # Named Views
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/vue-router-4-named-views"
+  title="Learn how to use named views"
+/>
+
 Sometimes you need to display multiple views at the same time instead of nesting them, e.g. creating a layout with a `sidebar` view and a `main` view. This is where named views come in handy. Instead of having one single outlet in your view, you can have multiple and give each of them a name. A `router-view` without a name will be given `default` as its name.
 
 ```html

diff --git a/docs/guide/essentials/navigation.md b/docs/guide/essentials/navigation.md
index 14b2eb9be0d742e5a93897f2dca739b4e4790215..af868da196b6e829d19f137bf7d354963ae7ec81 100644 (file)
--- a/docs/guide/essentials/navigation.md
+++ b/docs/guide/essentials/navigation.md
@@ -4,6 +4,11 @@ sidebarDepth: 0
 
 # Programmatic Navigation
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/vue-router-4-programmatic-navigation"
+  title="Learn how to navigate programmatically"
+/>
+
 Aside from using `<router-link>` to create anchor tags for declarative navigation, we can do this programmatically using the router's instance methods.
 
 ## Navigate to a different location
@@ -75,6 +80,11 @@ router.replace({ path: '/home' })
 
 ## Traverse history
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/go-back"
+  title="Learn how to use Vue Router to go back"
+/>
+
 This method takes a single integer as parameter that indicates by how many steps to go forward or go backward in the history stack, similar to `window.history.go(n)`.
 
 Examples

diff --git a/docs/guide/essentials/redirect-and-alias.md b/docs/guide/essentials/redirect-and-alias.md
index c91ead371bfc80e070bbafee16123911375e80fe..5bbb87fa32489ed8f5b66474633b22278d13a652 100644 (file)
--- a/docs/guide/essentials/redirect-and-alias.md
+++ b/docs/guide/essentials/redirect-and-alias.md
@@ -1,5 +1,10 @@
 # Redirect and Alias
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/vue-router-4-redirect-and-alias"
+  title="Learn how to use redirect and alias"
+/>
+
 ## Redirect
 
 Redirecting is also done in the `routes` configuration. To redirect from `/home` to `/`:

diff --git a/docs/guide/essentials/route-matching-syntax.md b/docs/guide/essentials/route-matching-syntax.md
index d61fea32df8368f0f7e2a70b19986297c9079c66..b1130363e0b42495ce659770df57fc742faa00b2 100644 (file)
--- a/docs/guide/essentials/route-matching-syntax.md
+++ b/docs/guide/essentials/route-matching-syntax.md
@@ -1,5 +1,10 @@
 # Routes' Matching Syntax
 
+<VueSchoolLink
+  href="https://vueschool.io/lessons/vue-router-4-advanced-routes-matching-syntax"
+  title="Learn how to use advanced route routes' matching syntax"
+/>
+
 Most applications will use static routes like `/about` and dynamic routes like `/users/:userId` like we just saw in [Dynamic Route Matching](./dynamic-matching.md), but Vue Router has much more to offer!
 
 :::tip

diff --git a/docs/guide/index.md b/docs/guide/index.md
index 152f3bda0329abf226b75579c4b7b6e0a0fa6a2b..243f911956bb0c993642720a17391db151084c03 100644 (file)
--- a/docs/guide/index.md
+++ b/docs/guide/index.md
@@ -3,7 +3,7 @@
 <VueSchoolLink
   href="https://vueschool.io/courses/vue-router-4-for-everyone"
   title="Learn how to build powerful Single Page Applications with the Vue Router on Vue School"
-/>
+>Watch a Free Vue Router Video Course</VueSchoolLink>
 
 Creating a Single-page Application with Vue + Vue Router feels natural: with Vue.js, we are already composing our application with components. When adding Vue Router to the mix, all we need to do is map our components to the routes and let Vue Router know where to render them. Here's a basic example:
 

diff --git a/docs/introduction.md b/docs/introduction.md
index 87ace9b78d2806d9ee1c2302ca56a42457201139..5497d2b9c2e36c943857bb7a5cfb3527f4cb5b5a 100644 (file)
--- a/docs/introduction.md
+++ b/docs/introduction.md
@@ -1,5 +1,10 @@
 # Introduction
 
+<VueSchoolLink
+  href="https://vueschool.io/courses/vue-router-4-for-everyone"
+  title="Learn how to build powerful Single Page Applications with the Vue Router on Vue School"
+>Watch a Free Vue Router Video Course</VueSchoolLink>
+
 Vue Router is the official router for [Vue.js](https://vuejs.org). It deeply integrates with Vue.js core to make building Single Page Applications with Vue.js a breeze. Features include:
 
 - Nested routes mapping