From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Mon, 21 Sep 2020 08:32:22 +0000 (+0200)
Subject: docs: fix named views
X-Git-Tag: v4.0.0-beta.12~11
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=bb6152828703af07587dc52d3ff4ec79e138183b;p=thirdparty%2Fvuejs%2Frouter.git

docs: fix named views
---

diff --git a/docs/guide/essentials/named-views.md b/docs/guide/essentials/named-views.md
index ad4617ce..87dd6f6a 100644
--- a/docs/guide/essentials/named-views.md
+++ b/docs/guide/essentials/named-views.md
@@ -3,9 +3,9 @@
 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
-<router-view class="view left-sidebar" name="left-sidebar"></router-view>
+<router-view class="view left-sidebar" name="LeftSidebar"></router-view>
 <router-view class="view main-content"></router-view>
-<router-view class="view right-sidebar" name="right-sidebar"></router-view>
+<router-view class="view right-sidebar" name="RightSidebar"></router-view>
 ```
 
 A view is rendered by using a component, therefore multiple views require
@@ -20,8 +20,10 @@ const router = createRouter({
       path: '/',
       components: {
         default: Home,
-        a: LeftSidebar,
-        b: RightSidebar,
+        // short for LeftSidebar: LeftSidebar
+        LeftSidebar,
+        // they match the `name` attribute on `<router-view>`
+        RightSidebar,
       },
     },
   ],