Vue はインターフェースのスライド効果を実装します

<テンプレート>
    <div>
        <トランジション:name="トランジション名">
            <router-view class="ルーター"></router-view>
        </トランジション>
 <テンプレート>    
  
 <スクリプト>    
 エクスポートデフォルト{
  データ （） {
    戻る {
     // 左から右にスライド transitionName:'slide-right',    
     } 
</スクリプト>   

<style lang="スタイラス">  
      .ルーター
            絶対的な位置
            幅 100%
            移行はすべて0.8秒で完了 
        .slide-left-enter、.slide-right-leave-active です。    
            不透明度 0
            -webkit-transform 翻訳(100%,0)
            変換 翻訳(100%,0)
        .slide-left-leave-active、.slide-right-enter
            不透明度 0
            -webkit-transform 翻訳(-100%,0)
            変換 translate(-100%,0) 
</スタイル>