剛剛開始看vue官方文檔，看到多個組件過渡時，自己動手實(shí)驗(yàn)了下，發(fā)現(xiàn)失敗了，沒有報錯，但是效果沒有，求大神指點(diǎn)。
下面貼代碼
html

<div id="example-5">
    <input type="radio" value="v-a" id="a" name="view">
    <label for="a">A</label>
    <input type="radio" value="v-b" id="b" name="view">
    <label for="b">B</label>
    <transition name="component-fade" mode="out-in">
        <component v-bind:is="view"></component>
    </transition>
</div>

JS

new Vue({
    el:'#example-5',
    data () {
        return {
            view:'v-a'
        }
    },
    components: {
        'v-a':{
            template:'<div>Component A</div>'
        },
        'v-b':{
            template:'<div>Component B</div>'
        }
    }
});

css

  .component-fade-enter-active,.component-fade-leave-active{
        transform: opacity .3s ease;
    }
    .component-fade-enter,.component-fade-leave-to{
        opacity:0;
    }

效果截圖如下