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。フェードコンポーネントは、トランジション効果が必要なコンポーネントをラップします。効果を



確認できます。