防止 Vue 组件内的路由更改

Question

是否可以防止 Vue 组件中的路由更改（不在我的路由器文件中）？

我的情况使用相同的组件，但是 URL 发生了变化（/users/1 -> /users/2）

Vue.extend({
  data: () => ({
     active: true
  }),
  beforeRouteLeave(to, from, next){
     if (this.active) {
        // do not redirect
     } else {
        next();
     }
  }
})

我的理解是，这在导航 URL 时不起作用，但 View/Component 保持不变。

Answer 1

我需要使用 beforeRouteUpdate 而不是 docs

中所述的 beforeRouteLeave

beforeRouteUpdate(to, from, next) {
    if (this.active) {
      next(false);
    } else {
      next();
    }
},

防止 Vue 组件内的路由更改

Prevent route change within Vue compnent

vue.js

vue-router