Skip to content

Commit 414410a

Browse files
perborgenperborgen
committed
use PromoLink for vue school links
1 parent a7d02d5 commit 414410a

File tree

14 files changed

+61
-27
lines changed

14 files changed

+61
-27
lines changed

‎src/guide/built-ins/teleport.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
# Teleport {#teleport}
22

3-
<VueSchoolLink href="https://vueschool.io/lessons/vue-3-teleport" title="Free Vue.js Teleport Lesson"/>
3+
<PromoLink href="https://vueschool.io/lessons/vue-3-teleport" title="Free Vue.js Teleport Lesson" type="vueschool">
4+
Watch a free video lesson on Vue School
5+
</PromoLink>
46

57
`<Teleport>` is a built-in component that allows us to "teleport" a part of a component's template into a DOM node that exists outside the DOM hierarchy of that component.
68

‎src/guide/components/events.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ if (typeof window !== 'undefined') {
2222

2323
> This page assumes you've already read the [Components Basics](/guide/essentials/component-basics). Read that first if you are new to components.
2424
25-
<div class="options-api">
26-
<VueSchoolLink href="https://vueschool.io/lessons/defining-custom-events-emits" title="Free Vue.js Lesson on Defining Custom Events"/>
27-
</div>
25+
<PromoLink href="https://vueschool.io/lessons/defining-custom-events-emits" title="Free Vue.js Lesson on Defining Custom Events" type="vueschool">
26+
Watch a free video lesson on Vue School
27+
</PromoLink>
2828

2929
## Emitting and Listening to Events {#emitting-and-listening-to-events}
3030

‎src/guide/components/props.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22

33
> This page assumes you've already read the [Components Basics](/guide/essentials/component-basics). Read that first if you are new to components.
44
5-
<div class="options-api">
6-
<VueSchoolLink href="https://vueschool.io/lessons/vue-3-reusable-components-with-props" title="Free Vue.js Props Lesson"/>
7-
</div>
5+
<PromoLink href="https://vueschool.io/lessons/vue-3-reusable-components-with-props" title="Free Vue.js Props Lesson" type="vueschool">
6+
Watch a free video lesson on Vue School
7+
</PromoLink>
88

99
## Props Declaration {#props-declaration}
1010

‎src/guide/components/registration.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22

33
> This page assumes you've already read the [Components Basics](/guide/essentials/component-basics). Read that first if you are new to components.
44
5-
<VueSchoolLink href="https://vueschool.io/lessons/vue-3-global-vs-local-vue-components" title="Free Vue.js Component Registration Lesson"/>
5+
<PromoLink href="https://vueschool.io/lessons/vue-3-global-vs-local-vue-components" title="Free Vue.js Component Registration Lesson" type="vueschool">
6+
Watch a free video lesson on Vue School
7+
</PromoLink>
68

79
A Vue component needs to be "registered" so that Vue knows where to locate its implementation when it is encountered in a template. There are two ways to register components: global and local.
810

‎src/guide/components/slots.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22

33
> This page assumes you've already read the [Components Basics](/guide/essentials/component-basics). Read that first if you are new to components.
44
5-
<VueSchoolLink href="https://vueschool.io/lessons/vue-3-component-slots" title="Free Vue.js Slots Lesson"/>
5+
<PromoLink href="https://vueschool.io/lessons/vue-3-component-slots" title="Free Vue.js Slots Lesson" type="vueschool">
6+
Watch a free video lesson on Vue School
7+
</PromoLink>
68

79
## Slot Content and Outlet {#slot-content-and-outlet}
810

‎src/guide/essentials/class-and-style.md

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,15 @@ A common need for data binding is manipulating an element's class list and inlin
55
## Binding HTML Classes {#binding-html-classes}
66

77
<div class="options-api">
8-
<VueSchoolLink href="https://vueschool.io/lessons/dynamic-css-classes-with-vue-3" title="Free Vue.js Dynamic CSS Classes Lesson"/>
8+
<PromoLink href="https://vueschool.io/lessons/dynamic-css-classes-with-vue-3" title="Free Vue.js Dynamic CSS Classes Lesson" type="vueschool">
9+
Watch a free video lesson on Vue School
10+
</PromoLink>
911
</div>
1012

1113
<div class="composition-api">
12-
<VueSchoolLink href="https://vueschool.io/lessons/vue-fundamentals-capi-dynamic-css-classes-with-vue" title="Free Vue.js Dynamic CSS Classes Lesson"/>
14+
<PromoLink href="https://vueschool.io/lessons/vue-fundamentals-capi-dynamic-css-classes-with-vue" title="Free Vue.js Dynamic CSS Classes Lesson" type="vueschool">
15+
Watch a free video lesson on Vue School
16+
</PromoLink>
1317
</div>
1418

1519
### Binding to Objects {#binding-to-objects}

‎src/guide/essentials/computed.md

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
11
# Computed Properties {#computed-properties}
22

33
<div class="options-api">
4-
<VueSchoolLink href="https://vueschool.io/lessons/computed-properties-in-vue-3" title="Free Vue.js Computed Properties Lesson"/>
4+
<PromoLink href="https://vueschool.io/lessons/computed-properties-in-vue-3" title="Free Vue.js Computed Properties Lesson" type="vueschool">
5+
Watch a free video lesson on Vue School
6+
</PromoLink>
57
</div>
68

79
<div class="composition-api">
8-
<VueSchoolLink href="https://vueschool.io/lessons/vue-fundamentals-capi-computed-properties-in-vue-with-the-composition-api" title="Free Vue.js Computed Properties Lesson"/>
10+
<PromoLink href="https://vueschool.io/lessons/vue-fundamentals-capi-computed-properties-in-vue-with-the-composition-api" title="Free Vue.js Computed Properties Lesson" type="vueschool">
11+
Watch a free video lesson on Vue School
12+
</PromoLink>
913
</div>
1014

1115
## Basic Example {#basic-example}
@@ -196,7 +200,7 @@ const now = computed(() => Date.now())
196200

197201
In comparison, a method invocation will **always** run the function whenever a re-render happens.
198202

199-
Why do we need caching? Imagine we have an expensive computed property `list`, which requires looping through a huge array and doing a lot of computations. Then we may have other computed properties that in turn depend on `list`. Without caching, we would be executing `list`’s getter many more times than necessary! In cases where you do not want caching, use a method call instead.
203+
Why do we need caching? Imagine we have an expensive computed property `list`, which requires looping through a huge array and doing a lot of computations. Then we may have other computed properties that in turn depend on `list`. Without caching, we would be executing `list`'s getter many more times than necessary! In cases where you do not want caching, use a method call instead.
200204

201205
## Writable Computed {#writable-computed}
202206

‎src/guide/essentials/conditional.md

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
11
# Conditional Rendering {#conditional-rendering}
22

33
<div class="options-api">
4-
<VueSchoolLink href="https://vueschool.io/lessons/conditional-rendering-in-vue-3" title="Free Vue.js Conditional Rendering Lesson"/>
4+
<PromoLink href="https://vueschool.io/lessons/conditional-rendering-in-vue-3" title="Free Vue.js Conditional Rendering Lesson" type="vueschool">
5+
Watch a free video lesson on Vue School
6+
</PromoLink>
57
</div>
68

79
<div class="composition-api">
8-
<VueSchoolLink href="https://vueschool.io/lessons/vue-fundamentals-capi-conditionals-in-vue" title="Free Vue.js Conditional Rendering Lesson"/>
10+
<PromoLink href="https://vueschool.io/lessons/vue-fundamentals-capi-conditionals-in-vue" title="Free Vue.js Conditional Rendering Lesson" type="vueschool">
11+
Watch a free video lesson on Vue School
12+
</PromoLink>
913
</div>
1014

1115
<script setup>

‎src/guide/essentials/event-handling.md

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
11
# Event Handling {#event-handling}
22

33
<div class="options-api">
4-
<VueSchoolLink href="https://vueschool.io/lessons/user-events-in-vue-3" title="Free Vue.js Events Lesson"/>
4+
<PromoLink href="https://vueschool.io/lessons/user-events-in-vue-3" title="Free Vue.js Events Lesson" type="vueschool">
5+
Watch a free video lesson on Vue School
6+
</PromoLink>
57
</div>
68

79
<div class="composition-api">
8-
<VueSchoolLink href="https://vueschool.io/lessons/vue-fundamentals-capi-user-events-in-vue-3" title="Free Vue.js Events Lesson"/>
10+
<PromoLink href="https://vueschool.io/lessons/vue-fundamentals-capi-user-events-in-vue-3" title="Free Vue.js Events Lesson" type="vueschool">
11+
Watch a free video lesson on Vue School
12+
</PromoLink>
913
</div>
1014

1115
## Listening to Events {#listening-to-events}
@@ -318,7 +322,7 @@ You can use the following modifiers to trigger mouse or keyboard event listeners
318322
- `.meta`
319323

320324
::: tip Note
321-
On Macintosh keyboards, meta is the command key (⌘). On Windows keyboards, meta is the Windows key (⊞). On Sun Microsystems keyboards, meta is marked as a solid diamond (◆). On certain keyboards, specifically MIT and Lisp machine keyboards and successors, such as the Knight keyboard, space-cadet keyboard, meta is labeled “META”. On Symbolics keyboards, meta is labeled “META” or “Meta”.
325+
On Macintosh keyboards, meta is the command key (⌘). On Windows keyboards, meta is the Windows key (⊞). On Sun Microsystems keyboards, meta is marked as a solid diamond (◆). On certain keyboards, specifically MIT and Lisp machine keyboards and successors, such as the Knight keyboard, space-cadet keyboard, meta is labeled "META". On Symbolics keyboards, meta is labeled "META" or "Meta".
322326
:::
323327

324328
For example:

‎src/guide/essentials/forms.md

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,15 @@ const multiSelected = ref([])
1616
# Form Input Bindings {#form-input-bindings}
1717

1818
<div class="options-api">
19-
<VueSchoolLink href="https://vueschool.io/lessons/user-inputs-vue-devtools-in-vue-3" title="Free Lesson on User Inputs with Vue.js"/>
19+
<PromoLink href="https://vueschool.io/lessons/user-inputs-vue-devtools-in-vue-3" title="Free Lesson on User Inputs with Vue.js" type="vueschool">
20+
Watch a free video lesson on Vue School
21+
</PromoLink>
2022
</div>
2123

2224
<div class="composition-api">
23-
<VueSchoolLink href="https://vueschool.io/lessons/vue-fundamentals-capi-user-inputs-in-vue" title="Free Lesson on User Inputs with Vue.js"/>
25+
<PromoLink href="https://vueschool.io/lessons/vue-fundamentals-capi-user-inputs-in-vue" title="Free Lesson on User Inputs with Vue.js" type="vueschool">
26+
Watch a free video lesson on Vue School
27+
</PromoLink>
2428
</div>
2529

2630
When dealing with forms on the frontend, we often need to sync the state of form input elements with corresponding state in JavaScript. It can be cumbersome to manually wire up value bindings and change event listeners:

‎src/guide/essentials/list.md

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
11
# List Rendering {#list-rendering}
22

33
<div class="options-api">
4-
<VueSchoolLink href="https://vueschool.io/lessons/list-rendering-in-vue-3" title="Free Vue.js List Rendering Lesson"/>
4+
<PromoLink href="https://vueschool.io/lessons/list-rendering-in-vue-3" title="Free Vue.js List Rendering Lesson" type="vueschool">
5+
Watch a free video lesson on Vue School
6+
</PromoLink>
57
</div>
68

79
<div class="composition-api">
8-
<VueSchoolLink href="https://vueschool.io/lessons/vue-fundamentals-capi-list-rendering-in-vue" title="Free Vue.js List Rendering Lesson"/>
10+
<PromoLink href="https://vueschool.io/lessons/vue-fundamentals-capi-list-rendering-in-vue" title="Free Vue.js List Rendering Lesson" type="vueschool">
11+
Watch a free video lesson on Vue School
12+
</PromoLink>
913
</div>
1014

1115
## `v-for` {#v-for}

‎src/guide/essentials/reactivity-fundamentals.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -224,7 +224,9 @@ The reactivity system is discussed in more details in the [Reactivity in Depth](
224224

225225
## Declaring Methods \* {#declaring-methods}
226226

227-
<VueSchoolLink href="https://vueschool.io/lessons/methods-in-vue-3" title="Free Vue.js Methods Lesson"/>
227+
<PromoLink href="https://vueschool.io/lessons/methods-in-vue-3" title="Free Vue.js Methods Lesson" type="vueschool">
228+
Watch a free video lesson on Vue School
229+
</PromoLink>
228230

229231
To add methods to a component instance we use the `methods` option. This should be an object containing the desired methods:
230232

‎src/guide/extras/composition-api-faq.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@ This FAQ assumes prior experience with Vue - in particular, experience with Vue
1010

1111
## What is Composition API? {#what-is-composition-api}
1212

13-
<VueSchoolLink href="https://vueschool.io/lessons/introduction-to-the-vue-js-3-composition-api" title="Free Composition API Lesson"/>
13+
<PromoLink href="https://vueschool.io/lessons/introduction-to-the-vue-js-3-composition-api" title="Free Composition API Lesson" type="vueschool">
14+
Watch a free video lesson on Vue School
15+
</PromoLink>
1416

1517
Composition API is a set of APIs that allows us to author Vue components using imported functions instead of declaring options. It is an umbrella term that covers the following APIs:
1618

‎src/guide/scaling-up/routing.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ In such SPAs, the "routing" is done on the client side, in the browser. A client
1212

1313
<!-- TODO update links -->
1414
<div>
15-
<VueSchoolLink href="https://vueschool.io/courses/vue-router-4-for-everyone" title="Free Vue Router Course">
15+
<PromoLink href="https://vueschool.io/courses/vue-router-4-for-everyone" title="Free Vue Router Course" type="vueschool">
1616
Watch a Free Video Course on Vue School
17-
</VueSchoolLink>
17+
</PromoLink>
1818
</div>
1919

2020
Vue is well-suited for building SPAs. For most SPAs, it's recommended to use the officially-supported [Vue Router library](https://github.com/vuejs/router). For more details, see Vue Router's [documentation](https://router.vuejs.org/).

0 commit comments

Comments
 (0)