feat(core): add 'on-complete' and 'on-abort' props to router-link

[kelunik]

This allows implementing a wrapper component handling aborted navigations, e.g. due to navigating to the exact same path (see #974), and other custom behavior such as a loading state showing on a button-like link.

Sample Implementation

Note: This doesn't trigger the scroll behavior hook, so that needs some separate PR / implementation automatically work, but that's fine, as we're not doing any navigation with this implementation.

<template>
  <div id="app">
    <router-link to="/" :on-abort="handleAbort">Home</router-link>
    <router-link to="/about" :on-abort="handleAbort">About</router-link>
    <router-view :key="$route.fullPath + ' @ ' + sameRouteCounter"/>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import HelloWorld from './components/HelloWorld.vue'

@Component({
  components: {
    HelloWorld
  }
})
export default class App extends Vue {
  sameRouteCounter: number = 0

  mounted () {
    this.$router.afterEach((to, from) => {
      if (to.fullPath !== from.fullPath) {
        this.sameRouteCounter = 0
      }
    })
  }

  handleAbort (err: any) {
    if (err.name === 'NavigationDuplicated') {
      this.sameRouteCounter++
      this.$nextTick().then(() => {
        window.scroll(0, 0)
      })
    }
  }
}
</script>

Implements #3027.

[posva]

Thanks but as mentioned in #3027, this still need more thinking