진스
Vue Router Transitions(라우터 트랜지션) 본문
728x90
참고.
router.vuejs.org/guide/advanced/transitions.html#per-route-transition
Transitions | Vue Router
Transitions Since the is essentially a dynamic component, we can apply transition effects to it the same way using the component: All transition APIs work the same here. Per-Route Transition The above usage will apply the same transition for all routes. If
router.vuejs.org
<트랜지션 태그 안에 있는 템플릿들에 효과를 부여한다.>
방법1. 이렇게 <router-view>를 <transition>으로 감싼후 아래 링크 참고
App.vue
|
1
2
3
|
<transition>
<router-view></router-view>
</transition>
|
cs |
All transition APIs work the same here.
위 링크를 접속하면 아래 화면이 나오는데.
vuejs.org/v2/guide/transitions.html
Enter/Leave & List Transitions — Vue.js
Vue.js - The Progressive JavaScript Framework
vuejs.org
방법2. <transition>안에 이름을 붙이고 스타일에 아래 처럼 입력하면 끝.
App.vue
728x90
'Vue' 카테고리의 다른 글
| 간단한 event Bus 등록 및 사용예 (0) | 2021.04.24 |
|---|---|
| 믹스인과 하이 오더 컴포넌트 비교 분석 (0) | 2021.04.24 |
| vue 웹팩 데브 서버 (Webpack Dev Server) 다른 서버 실행 (0) | 2021.04.22 |
| ★vue 작업시 자주 쓰는 것들 모음 (0) | 2021.04.21 |
| vue 에서 fontawesome(폰트어썸) 사용방법 2가지 (0) | 2021.04.21 |
'Vue' Related Articles
more
Comments