Vue.js 如何使组件内的按钮更改vue路由器路径

我有一个组件内的按钮。我正在使用vue router for vuejs 2.5，如果单击此按钮，我想更改路径。如何在每次单击按钮时更新路径

const Home={template:'Home
单击我
返回}
const Foo={template:'Foo您可以使用vue路由的“to”属性

在标记道具上，您必须为“渲染”按钮设置按钮值


福
您可以简单地向按钮添加一个单击侦听器：

 <template>
  <div id="app">
    <button @click="redirectToHome()">Go Back</button>
    <button @click="redirectToFoo()">Click ME</button>
  </div>
</template>


回去
点击我

并在方法内部实现它们

<script>
export default {
  name: "#app",
  methods: {
    redirectToHome() {
      this.$router.push({ path: '/' });
    },
    redirectToFoo() {
      this.$router.push({ path: '/foo' });
    }
  }
};
</script>


导出默认值{
名称：“#应用程序”，
方法：{
重定向到主页（）{
这是.$router.push（{path:'/'}）；
},
重定向tofoo（）{
这是.$router.push（{path:'/foo'}）；
}
}
};

有关编程导航的更多详细信息，请参见：
在我的示例中，我有两个按钮。单击“我”并返回。我如何使这些按钮转到Foo。router link是嵌套在组件内部，还是必须保持在原来的位置？必须保持在那里。如果要嵌套，必须放入其他按钮。是。router.push的核心功能暂时可用
<script>
export default {
  name: "#app",
  methods: {
    redirectToHome() {
      this.$router.push({ path: '/' });
    },
    redirectToFoo() {
      this.$router.push({ path: '/foo' });
    }
  }
};
</script>