@CRIMX의 답변에 따르면 기본적으로 enter와 enter active 두 클래스가 첫 번째 프레임에서 애니메이션 요소에 동시에 존재하고 Enter 클래스를 제거하여 애니메이션이 실행됩니다. 활성 클래스의 내용을 미리 적용할 수 없습니다.

two-class 방식으로 애니메이션을 완성하는데는 충분하지만 사실 이해가 쉽지 않아서 vue 2.1.8부터 애니메이션의 종료 상태를 active 클래스와 구분할 수 있는 to라는 클래스 이름을 추가하기 시작했고, 순차적 적용 범위 문제를 더 쉽게 이해하고 방지할 수 있습니다.

요소가 삽입되면 v-enter와 v-enter-active가 동시에 적용됩니다. 전자는 다음 프레임에서 제거되고 후자는 애니메이션이 완료된 후 제거됩니다. 따라서 v-enter-active를 먼저 작성해야 합니다. 휴가도 마찬가지다.

정말 이상하네요. 다음에 액티브로 쓸 땐 앞에 쓰고 전문가의 설명을 기다리겠습니다

공식 웹사이트에서 매우 자세한 설명을 보실 수 있습니다: https://cn.vuejs.org/v2/guide/transitions.html#过渡的-CSS-类名