title: Vue Router hooks not triggered in component, using Typescript
body: <p>This has been puzzling me for a while. I have searched quite a bit, but still have no idea, why the route-hooks doesn’t work in component:</p>
  
  <p><strong>1. The component is loaded from RouterView:</strong></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;router-view class="z1" :key="$route.name" /&gt;
  </code></pre>
  
  <p><strong>2. I have registered the hooks in <code>main.ts</code>, and also in <code>My.vue</code> -- BEFORE the class definition (to ensure the registration is right here):</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>Component.registerHooks([
      'beforeRouteEnter',
      'beforeRouteLeave',
      'beforeRouteUpdate',
  ]);
  </code></pre>
  
  <p><strong>3. The hook even works in my router config:</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>{
      path: '/my',
      name: 'my',
      component: My,
      // beforeEnter: (to: Route, from: Route, next: any): void =&gt; {
      //  console.log('It works!’);  // It works here!
      // }
  },
  </code></pre>
  
  <p><strong>4. But it doesn’t work in my Component:</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>@Comp()
  export default class My extends Vue {
      public beforeRouteEnter (to: Route, from: Route, next: any): void {
          debugger;       // not triggered!
          next((vm: Vue.Component) =&gt; {
              debugger;   // not triggered!
              next();
          });
      }
  }
  </code></pre>
  
  <p>So could anyone help me with that?</p>