JS 애니메이션 VUE - 애니메이션 후크

https://www.jianshu.com/p/55305c53de13

전환 애니메이션 후크 지인 :

  < DIV ID = "루트" > 
    < 트랜지션 이름 = '페이드'
       @ 전에 입력 = 'handleBeforeEnter'
       @enter = 'handleEnter를'
       @ 입력 한 후- = 'handleAfterEnter'
     > 
      < H1 V-쇼 = '쇼' > 
        最是年少时模样
      </ H1 > 
    </ 천이 > 
    < 버튼 @click = '변화' >切换</ 버튼 > 
  </ DIV > 
  <스크립트 > 
    VAR VM =새로운 뷰 ({ 
      EL : ' #root ' , 
      데이터 { 
        표시 : 
      } 
      방법 { 
        변화율 : 함수 () {
           .show =! .show; 
        } 
        handleBeforeEnter : 함수 (EL) { 
          CONSOLE.LOG ( ' ' ) 
          el.style.color은 = ' 빨간색 ' 
        ,} 
        : handleEnter이 기능 (엘이) {수행 
          (CONSOLE.LOG를 '입력 ' ); 
          에서는 setTimeout (() => { 
            el.style.color = ' 녹색 ' 
          }, 2000 ) 
          에서는 setTimeout (() => { 
            수행 (); 
          }, 4000 ) 
        }, 
        handleAfterEnter : 기능 (엘) { 
          을 console.log ( ' ' ); 
          el.style.color = ' # 000000 ' 
        } 
      } 
    }) 
  </ 스크립트 >

 

추천

출처www.cnblogs.com/em2464/p/12337910.html