Applying v-transition to vue.js (v 1.0.1) router-view

Question

I am creating a one-page application using vue.js and vue-router .. the links are working right now, but I want to add a transition using a v-transition.

but according to the documentation

More importantly, flow control directives, non-prop attributes, and transitions on a component element will be ignored because there is no root element to bind them to - vue.js components

<router-view class="bounce" v-transition="bounce" transition-mode="out-in"></router-view>

so technically the v-transition in the view tag of the router will be ignored, since this is an instance of the fragment.

so any idea where I can put a v-transition to apply transitions when changing the route?

Answer 1

node :

<router-view class="bounce">
    <div v-transition="bounce" transition-mode="out-in">
    </div>
</router-view>

Vue DOM, , v-show.