vue中路由跳转的三种 方式
一、router-link
浏览器解析后跳转
不带参数写法:
带参数写法:
二、this.
r
o
u
t
e
r
.
p
u
s
h
(
p
a
t
h
:
’
/
需
要
跳
转
的
地
址
’
)
(
函
数
调
用
)
不
带
参
数
t
h
i
s
.
router.push({path:’/需要跳转的地址’}) (函数调用) 不带参数 this.
router.push(path:’/需要跳转的地址’)(函数调用)不带参数this.routwe.push(’/home’);
this.
r
o
u
t
e
r
.
p
u
s
h
(
n
a
m
e
:
′
h
o
m
e
′
)
;
t
h
i
s
.
router.push({name:'home'}); this.
router.push(name:′home′);this.router.push({path:’/home’})
带参数
1.query传参
this.
r
o
u
t
e
r
.
p
u
s
h
(
n
a
m
e
:
′
h
o
m
e
′
,
q
u
e
r
y
:
i
d
:
′
1
′
)
;
t
h
i
s
.
router.push({name:'home',query:{id:'1'}}); this.
router.push(name:′home′,query:id:′1′);this.router.push({path:’/home’,query}:{id:1});
2.params传参
this.$router.push({name:‘home’,params:{id:1}})
3.query和params的区别
query类似get,跳转之后页面url后面会拼接参数,类似?id=1,非重要性的可以这样传,密码之类还是用params刷新页面id还在
params类似post,跳转页面之后url后面不会拼接参数,但是刷新页面id会消失
三、this.
r
o
u
t
e
r
.
g
o
(
n
)
t
h
i
s
.
router.go(n) this.
router.go(n)this.router.go(n)
//向前或者向后跳转n个页面,n可以为正整数或负整数