vue-router-rerendering

HTML

<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>

<div id="app">
  <router-link to="/default">Default</router-link>
  <router-link to="/refresh" @click.native="updateKey()">Refresh</router-link>

  <router-view :key='k'></router-view>
</div>

<template id="default">
  <div>
    <div>Rendering Time : {{now}}</div>
    <div>
    메뉴 진입 후 동일 메뉴 재클릭시 화면이 다시 렌더링 되지 않음.
    </div>
  </div>
</template>

<template id="refresh">
  <div>
    <div>Rendering Time : {{now}}</div>
    <div>
    메뉴 진입 후 동일 메뉴 재클릭시 화면이 다시 렌더링 됨.
    </div>
  </div>
</template>

JavaScript

const Default = {
  template: '#default',
  data: function() {
    return {
      now: Date.now()
    }
  }
}

const Refresh = {
  template: '#refresh',
  data: function() {
    return {
      now: Date.now()
    }
  }
}

const router = new VueRouter({
  routes: [{
      path: '/default',
      component: Default
    },
    {
      path: '/refresh',
      component: Refresh
    }
  ]
})

const app = new Vue({
  el: '#app',
  router,
  data: {
    routeKey: Date.now(),
    k:"1"
  },
  methods: {
    updateKey: function() {
     
      this.k=Date.now()+111
    }
  }
})