Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

beforeRouteLeave not trigged when used in a sub-component

See original GitHub issue

Hi, I have

<component-with-route>
  <sub-component>

The beforeRouteLeave guard in the SubComponent never fires. Bug? Or do I anything wrong? Or simply missing feature?

Thanks!

Issue Analytics

State:
Created 7 years ago
Reactions:2
Comments:8 (3 by maintainers)

Top GitHub Comments

1reaction

AwaisSikandercommented, Apr 21, 2022

I want to add something In routes.js For routes hooks to work component should not be imported as lazyLoadView BAD for router hooks { path: ‘salary-notifications’, name: ‘salary-notifications’, component: () => lazyLoadView( import(‘@views/settings/notifications-settings/salaryNotifications.vue’), ), }, Good For Router hooks

{ path: ‘theme-settings’, name: ‘theme-settings’, component: () => import(‘@views/settings/theme-settings/theme-settings.vue’), },

0reactions

icehazardcommented, Jun 29, 2020

Try :key=“$route.fullPath” on the parent <router-view> and on the child <router-view>

Top Results From Across the Web

Vue Router beforeRouteLeave doesn't stop subcomponents

As you are using a sub-component (inside the route component), you will not be able to use beforeRouteLeave directly. Your sub-component is ...

In-Component Guard beforeRouteLeave not working [Solved]

I have a component like this in my Vue SPA <template> <canvas v-bind:id="'chart-hardsets-program-' + programId" width="400" height="150"></canvas> ...

Vue.js: Using beforeRouteLeave in a sub-component of a route

1. const HomeComponent = Vue.component('home', { ; 2. template: ` ; 3. <div> ; 4. <p>This is my home route</p> ; 5. <router-link...

Vue Router beforeRouteLeave doesn't stop subcomponents ...

There are no disadvantages, but this trigger is not exactly tied to the route change, incase you wanted to do any other actions...

Vue Router beforeRouteLeave doesn't stop subcomponents

I just want to cancel sub-component when route changed. ... the route component), you will not be able to use beforeRouteLeave directly.