vue中如何使用this.$router.push()实现跳转页面

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

this.$router.push()

1. 不带参数
this.$router.push('/home')
this.$router.push({name:'home'})
this.$router.push({path:'/home'})
 
2. query传参 
this.$router.push({name:'home',query: {id:'123456'}})
this.$router.push({path:'/home',query: {id:'123456'}})
// html 取参 $route.query.id    script 取参 this.$route.query.id
 
3. params传参
this.$router.push({name:'home',params: {id:'123456'}}) // 只能用 name
// 路由配置 path: "/home/:id" 或者 path: "/home:id" ,
// 不配置path ,第一次可请求,刷新页面id会消失
// 配置path,刷新页面id会保留
// html 取参 $route.params.id    script 取参 this.$route.params.id
 
4. query和params区别
query类似get, 跳转之后页面url后面会拼接参数,类似?id=123456, 非重要性的可以这样传, 密码之类还是用params刷新页面id还在
params类似post, 跳转之后页面url后面不会拼接参数, 但是刷新页面id会消失。

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

nginx下怎么部署vue项目:本文主要介绍"nginx下如何部署vue项目",希望能够解决您遇到有关问题,下面我们一起来看这篇 "nginx下如何部署vue项目" 文章。首先要去nginx官网下下载nginx:下载地址:下载下来会是一个解 ...