vue-router如何实现路由跳转,并且携带参数

在Vue中使用vue-router实现路由跳转并携带参数，可以通过以下步骤实现：

1. 在路由配置文件中定义路由路径和组件

import VueRouter from 'vue-router'
import Home from './components/Home.vue'
import About from './components/About.vue'

const router = new VueRouter({
  routes: [
    { path: '/', component: Home },
    { path: '/about/:id', component: About }
  ]
})

2. 在组件中使用`<router-link>`标签实现路由跳转

<template>
  <div>
    <router-link to="/">Home</router-link>
    <router-link :to="'/about/' + id">About</router-link>
  </div>
</template>

<script>
export default {
  data() {
    return {
      id: 1
    }
  }
}
</script>

3. 在路由跳转时，通过`$route.params`获取参数

export default {
  mounted() {
    console.log(this.$route.params.id) // 输出路由参数
  }
}

这样就可以实现路由跳转并携带参数了。