diff --git a/src/guide/component-basics.md b/src/guide/component-basics.md index cda0c9b5c6..64c2a32f03 100644 --- a/src/guide/component-basics.md +++ b/src/guide/component-basics.md @@ -54,7 +54,7 @@ Components can be reused as many times as you want: ``` - + Notice that when clicking on the buttons, each one maintains its own, separate `count`. That's because each time you use a component, a new **instance** of it is created. @@ -111,7 +111,7 @@ Once a prop is registered, you can pass data to it as a custom attribute, like t ``` - + In a typical app, however, you'll likely have an array of posts in `data`: @@ -227,7 +227,7 @@ Then the child component can emit an event on itself by calling the built-in [** Thanks to the `@enlarge-text="postFontSize += 0.1"` listener, the parent will receive the event and update the value of `postFontSize`. - + We can list emitted events in the component's `emits` option: diff --git a/src/guide/component-dynamic-async.md b/src/guide/component-dynamic-async.md index d66fa754f6..4d8367b918 100644 --- a/src/guide/component-dynamic-async.md +++ b/src/guide/component-dynamic-async.md @@ -12,7 +12,7 @@ Earlier, we used the `is` attribute to switch between components in a tabbed int When switching between these components though, you'll sometimes want to maintain their state or avoid re-rendering for performance reasons. For example, when expanding our tabbed interface a little: - + You'll notice that if you select a post, switch to the _Archive_ tab, then switch back to _Posts_, it's no longer showing the post you selected. That's because each time you switch to a new tab, Vue creates a new instance of the `currentTabComponent`. @@ -27,7 +27,7 @@ Recreating dynamic components is normally useful behavior, but in this case, we' Check out the result below: - + Now the _Posts_ tab maintains its state (the selected post) even when it's not rendered. diff --git a/src/guide/events.md b/src/guide/events.md index 7d9e2d5701..c39136024c 100644 --- a/src/guide/events.md +++ b/src/guide/events.md @@ -25,7 +25,7 @@ Vue.createApp({ Result: - + ## Method Event Handlers @@ -62,7 +62,7 @@ Vue.createApp({ Result: - + ## Methods in Inline Handlers @@ -87,7 +87,7 @@ Vue.createApp({ Result: - + Sometimes we also need to access the original DOM event in an inline statement handler. You can pass it into a method using the special `$event` variable: diff --git a/src/guide/forms.md b/src/guide/forms.md index 7eabf9826f..5eccb21c68 100644 --- a/src/guide/forms.md +++ b/src/guide/forms.md @@ -157,7 +157,7 @@ Multiple select (bound to array): Selected: {{ selected }} ``` - + Dynamic options rendered with `v-for`: diff --git a/src/guide/list.md b/src/guide/list.md index e21714896c..34bc3fe3b7 100644 --- a/src/guide/list.md +++ b/src/guide/list.md @@ -217,7 +217,7 @@ methods: { Result: - + ## `v-for` on a `