vue中如何使用router-link实现跳转页面

本文主要介绍"vue中怎么使用router-link实现跳转页面"，希望能够解决您遇到有关问题，下面我们一起来看这篇 "vue中怎么使用router-link实现跳转页面" 文章。

router-link跳转

1.不带参数
<router-link :to="{name:'home'}"> 
<router-link :to="{path:'/home'}"> //name,path都行, 建议用name 
// 注意：router-link中链接如果是'/'开始就是从根路由开始；如果不带'/'，则从当前路由开始。
 
2.带params参数
<router-link :to="{name:'home', params: {id:123456}}"> 
// params传参数 (类似post)
// 路由配置 path: "/home/:id" 或者 path: "/home:id" 
// 不配置path ,第一次可请求,刷新页面id会消失；配置path,刷新页面id会保留。
// html 取参 $route.params.id    script 取参 this.$route.params.id
 
3.带query参数
<router-link :to="{name:'home', query: {id:123456}}"> 
// query传参数 (类似get,url后面会显示参数)
// 路由可不配置
// html 取参 $route.query.id    script 取参 this.$route.query.id

关于 "vue中怎么使用router-link实现跳转页面" 就介绍到这。希望大家多多支持编程宝库。

vue中如何使用this.$router.go(n) 实现跳转页面：本文主要介绍"vue中怎么使用this.$router.go(n) 实现跳转页面"，希望能够解决您遇到有关问题，下面我们一起来看这篇 "vue中怎么使用this.$rout ...