Vue.js 在vuejs中将路由之前追加到模板

我想这样做：

<router-link  :to="{name: 'home'}"
              before-enter="fooMethod">
      Click here
</router-link>

基本上，我希望在更改路由之前调用一个方法

我已经用这种方法解决了问题：

<div @click="pushToRoute()">Click here</div>

// Methods
pushToRoute(){
  this.globalVariable = "changed";
  this.$route.push({name: 'home'})
}

---

但是这种方法的问题是它没有在HTML中呈现，因此属性对SEO没有贡献。在离开路由之前调用方法时，是否有任何方法可以实现属性的呈现？

在离开路由之前，可以使用。它可以访问该组件，这意味着您可以使用组件中的任何数据以及存储来同步修改某些内容，或者读取某些内容来决定是否要浏览导航。在您的情况下，您可能希望在退出之前使用

根据您想要完成的任务，您可能希望使用全局导航卫士，例如，在处理转换时，或者在几页中需要发生某些事情时。在这种情况下，您可以在路由器实例上调用beforeach并在那里执行您的魔术

  beforeRouteLeave(to, from, next) {
    this.dummyCounter++;

    if (this.dummyCounter % 4 !== 0) {
      // Stay where we are
      next(from.fullPath);
      return;
    }

    // Always call next to continue, or it will forever stay in limbo
    next();
  }