title: Force re-render of vue component on click of router link
body: <p>I'm having an issue trying to get a component to re-render on nav click while on the same component. For example, I'm on /one -- clicking on the nav link for /one does not re-render the component which I would like it to do. Any bright ideas on how to achieve this?</p>
  
  <p>router:</p>
  
  <pre><code>import Vue from 'vue'
  import Router from 'vue-router'
  
  Vue.use(Router)
  import One from '../pages/One.vue'
  import Two from '../pages/Two.vue'
  
  const router = new Router({
     mode: 'history',
     routes: [
      { path: '/one', component: One, name: 'One', meta: {title: 'One'} },
      { path: '/two', component: Two, name: 'Two', meta: {title: 'Two'} },
      ]
  });
  export default router;
  </code></pre>
  
  <p>nav.vue:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      &lt;ul&gt;
        &lt;li v-for="item in nav"&gt;
          &lt;nav-link class="nav-root-link" v-else :link="item"&gt;&lt;/nav-link&gt;
        &lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  
  &lt;/template&gt;
  
  &lt;script&gt;
  
    import navLink from './navLink.vue'
    export default {
      components: { navLink },
      data () {
        return {
          groupVisible: [],
          nav: [
            { name: 'One', to: {name: 'One'}},
            { name: 'Two', to: {name: 'Two'}},
          ]
        }
      },
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>navLink.vue:</p>
  
  <pre><code>&lt;template&gt;
    &lt;router-link class="nav-link" :to="link.to"&gt;
      &lt;span class="nav-link-name"&gt;{{ link.name }}&lt;/span&gt;
    &lt;/router-link&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
    export default {
      props: {
        link: {
          required: true,
          type: Object
        }
      },
    }
  &lt;/script&gt;
  </code></pre>