Vue 프로젝트가 효과 구성 요소를 페이드 및 페이드합니다.

구성 요소가 숨겨 지거나 표시 될 때 사용되는 일반 구성 요소로 전환 효과를
원합니다 . 일반 구성 요소 정의 : 이름은 자체 선택이며 여기에서 Fade.vue를 정의했습니다.

<template>
    <transition>
        <slot></slot>      放那个希望有过度动画的组件
    </transition>
</template>

<script>
export default {
    
    
    name: 'Fade'
}
</script>

<style lang="stylus" scoped>

    .v-enter, .v-leave-to
        opacity 0
    .v-enter-active , .v-leave-active
        transition opacity .6s ease
</style>

사용 :
1. 상위 구성 요소에 Fade.vue를 도입합니다
. 2. Fade 구성 요소가 전환 효과가 필요한 구성 요소를 래핑하면 효과를



볼 수 있습니다 .