Vue - 빌트인 컴포넌트, Transition

Transition

애니메이션 전환 효과를 추가
특징은 css에 지정한 시간을 판단해서 전환을 실행
전환할 때 순간적으로 요소에 클래스를 삽입

Animate.css

css 애니메이션 라이브러리
애니메이션 구조를 만들어 놓음

npm i animate.css

main.ts에서 import "animate.css"로 가져오기

애니메이션 지정

.hello-enter-active{
	animation-name: bounceInDown;
    animation-duration: 1s;
}
.hello-leave-active{
	animation-name: flip;
    animation-duration: 1s;
}