Vue переход с v-if и v-else не работает - PullRequest
Новая
       7

Vue переход с v-if и v-else не работает

0 голосов
/ 03 января 2019

Я не могу добавить анимацию с помощью transition или transition-group.У меня есть код: 

    <transition mode="out-in" enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
        <div key=1 v-if="$route.name !== null">
            <router-view></router-view>
        </div>
        <div v-else key=2>
            <p>First text</p>
            <p>Second text</p>
        </div>
    </transition>

изменение не помогает с transtition на transition-group.Переход должен окружать: 

<div v-if="$route.name !== null">
   <router-view></router-view>
</div>

и 

<p>First tex</p>
<p>Second text</p>

1 Ответ

0 голосов
/ 03 января 2019

Я нашел решение.Я использовал transition два раза.Я не знаю, стоит ли мне это делать, но сейчас это работает. 

    <transition mode="out-in" enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
        <div key="save" v-if="$route.name !== null">
             <transition mode="out-in" enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
            <router-view></router-view>
            </transition>
        </div>
        <div v-else key="edit">
           <p>First tex</p>
           <p>Second text</p>
        </div>
    </transition>
...