vue 路由跳转点击按钮跳转到某一个页面

在 Vue 中使用 Vue Router 进行页面路由跳转，可以通过以下步骤实现：

1. 在 Vue 程序中安装 Vue Router

npm install vue-router --save

2. 在 Vue 程序中创建路由配置文件 `router.js`

import Vue from 'vue';
import Router from 'vue-router';

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: '/',
      name: 'home',
      component: Home
    },
    {
      path: '/about',
      name: 'about',
      component: About
    }
  ]
})

3. 在 Vue 组件中使用路由

<template>
  <div>
    <button @click="gotoHome">Go to home</button>
    <button @click="gotoAbout">Go to about</button>
  </div>
</template>

<script>
export default {
  methods: {
    gotoHome() {
      this.$router.push({ path: '/' });
    },
    gotoAbout() {
      this.$router.push({ path: '/about' });
    }
  }
}
</script>

在上面的示例代码中，我们在 Vue 组件中添加了两个按钮，分别用于跳转到首页和关于页面。当用户点击这些按钮时，Vue 组件会调用 `this.$router.push()` 方法进行路由跳转。`this.$router.push()` 方法接收一个路由配置对象，其中 `path` 属性表示需要跳转的页面路径。

注意，在使用 `$router.push()` 方法时，必须先在 Vue 组件中引入 Vue Router，并且要在 Vue Router 的配置文件中定义需要跳转的页面路由。