Vue 에선 transition 이 엄청 쉽다 !

Transition

Vue 에선 Transition 이 엄청 쉽다.

먼저 <Transition> 태그로 감싸주고, 그안에 name을 fade로 지어줬다.

 

모달창이 나타날 때 투명도 조정을 통해 0.5초 동안 페이드 효과를 줄거다.

 

<script> 태그 내부

script 태그 내부에 아까 name 이던 fade를 먼저 작성한다.

 

나타나는 효과는 enter

반대의 사라지는 경우는 leave

 

그 후 이전 JS 스타일의 from to 형식이다.

active는 그 효과의 속도를 지정했다.