Vue JSルータビューでのQuasarフレームワークトランジションレンダリングの衝突

Question

ルータビューを囲むq-transitionに問題があります。移行が発生すると、古いコンテンツがDOMを離れる前に新しいコンテンツが表示されます。新しいコンテンツを既存の要素の下に置くと、古いコンテンツが最後に消えた後にポップアップします。これは既知の問題ですか、私はちょうど何か間違っていますか？回避策はありますか？

<q-transition appear enter="bounceInLeft" leave="bounceOutRight"> 
    <router-view></router-view> 
</q-transition> 

新しいコンテンツが低くなってから再描画されることがわかります。

おかげ

Answer 1

は、基礎となるのVueアニメーション/遷移機能を見て、答えを見つけました。ここに指定されているように、mode = "out-in"に設定する必要があります。https://vuejs.org/v2/guide/transitions.html