VUE
[Vue] params 혹은 query가 포함된 라우터(Router) 주소 이동시 페이지 갱신
hobbada
2021. 5. 11. 20:52
Vue Router 이용할 때, 원하는 페이지 이동을 위해서 push 혹은 replace 메소드를 이용한다.
1
2
3
4
5
|
// push
this.$router.push('hobbada.com/post')
// replace
this.$router.replace('hobbada.com/post')
|
cs |
하지만, 동일한 페이지에서 query나 params의 값만 변경될 때는 페이지 갱신이 이루어지지 않는 문제가 발생한다.
1
2
3
|
// 같은 Post 페이지에서 query만 다른 페이지로 이동시 작동 X
this.$router.push({ name: 'Post', query: { id: '33' } })
|
cs |
이럴 경우 해당 페이지를 호출하는 router view에 key값을 넣어주면 해결할 수 있다.
1
|
<router-view :key="$route.fullPath"/>
|
cs |
반응형