<template >
  <div>
    <h3>My profile</h3>
    <h4>{{$route.params.id}}</h4>
    <router-link :to="{ name: 'Profile', params: {id: 456}, query: {plan: 'private'} }">Another Route</router-link>
    <br>
    <router-link :to="{ name: 'Info', params: {id: 3} }">Info</router-link>
    <h5>{{$route.query}}</h5>
    <router-view />

  </div>
</template>

<script>
export default {
  watch: {
    $route(to, from){
      console.log('to', to);
      console.log('from', from);
    }
  }
}

</script>

<style lang="css" scoped>
</style>
