title: Vue.JS - Main layout component and routing
body: <p><br/>
  I have a <strong>main layout component</strong> ( who is composed by a fixed top header and a left side menu with multiple links created by router-link component ) and a <strong>"dynamic" layout component</strong> who is the hearth of the page.<br/>
  I would like this to change the center of my site by routing on different components according to the clicked link on the left menu.<br/>
  In order to do this, I have placed the router-view in my App.vue who is the higher level of Vue component in my app, like in the following code :</p>
  
  <pre><code>&lt;template&gt;
    &lt;div id="app"&gt;
      &lt;layout&gt;
        &lt;router-view/&gt;
      &lt;/layout&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>There is my main layout component, who contains the header and the left menu, this is the fixed part of my website :</p>
  
  <pre><code>&lt;template&gt;
   &lt;v-app&gt;
     &lt;loader&gt;&lt;/loader&gt;
     &lt;v-layout row wrap&gt;
       &lt;v-flex xs12&gt;
         &lt;stickyHeader&gt;&lt;/stickyHeader&gt;
       &lt;/v-flex&gt;
       &lt;v-flex xs2&gt;
         &lt;sideNavMenu&gt;&lt;/sideNavMenu&gt;
       &lt;/v-flex&gt;
     &lt;/v-layout&gt;
   &lt;/v-app&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>My sideNavMenu component contains multiple router-link components like this</p>
  
  <pre><code>&lt;router-link to="/home"&gt;Accueil&lt;/router-link&gt;
  </code></pre>
  
  <p>that I'm catching in my router, to attach a specific Url to a vue component</p>
  
  <pre><code>export default new Router({
    routes: [
     {
       path: '/home',
       name: 'home',
       component: home
     }
   ]
  })
  </code></pre>
  
  <p>But it doesn't work, and I don't understand why. Hence, I need help :)</p>