목록react-transition-group (1)

뇌 채우기 공간

[REACT] react transition group /리액트 라우터에 애니메이션 주기, 슬라이드 애니메이션, 특정 페이지에만 라우트 애니메이션

react router에 tansition을 주고 싶어! 그래서 찾아봤던 것이 react-transition-group이다. React-Router는 현재 경로가 바뀌면 즉이 DOM에서 제거하기 때문에 화면을 겹쳐서 애니메이션을 주려면 history가 바뀌기 전에 애니메이션을 실행시켜야한다. 공식적으로는 react-transition-group 사용을 권장한다. 리액트 공식 라이브러리이다. 공식문서가기 모든 페이지에 트랜지션 주기 일단 모든 페이지에 트랜지션을 주는 것은 쉽다. TransitionGroup태그와 CSSTransition 태그를 Switch위에 감싸주면 된다. 라우터는 각각의 key를 갖게 되는데 그것을 pathname으로 준다. key를 가진 라우터에게 classNames가 pageSli..
WEB/REACT 2021. 8. 21. 19:51
이전 Prev 1 Next 다음