한준호

■사용법 vue 에서 transition기능을 컴포넌트로 제공한다. 다음은 Vue 공식 문서에 나와있는 8가지 transition 클래스에 대한 내용이다. 트랜지션은 name속성을 갖고 있는데, css의 선택자와 같은 역할을 한다. 각 클래스들의 관계를 정리하면 아래와 같다. 일반적으로 v-enter, v-leave-to 를 함께 사용하고, v-enter-to, v-leave를 함께 사용한다. {{ "Pit-A-Pat-Korean" }} — {{ $t("yalliyalli.pap.common.no13") }} — {{ "Pit-A-Pat-Korean" }} transition을 적용하고 싶은 태그를 transition 태그로 감싸고 name을 설정해 주면 아래와 같이 css처럼 트랜지션 클래스를 사용할 ..

■DOM(Document Object Model) - 웹 페이지를 객체로 표현하는 모델. ■Dom은 어떻게 움직일까 1. 브라우저는 HTML Parser를 통해 HTML 태그를 파싱하여 돔 트리 를 구성한다. 또한 브라우저는 스타일 시트에서 CSS Parser를 통해 Css를 파싱하여 스타일 규칙 을 만들어낸다. 2. 돔 트리와 스타일 규칙이 합쳐져 렌더 트리 를 만들어낸다. 그런데 DOM에는 수 천개의 노드들이 존재하고 이에 대한 수정을 필요로 한다면? 브라우저의 속도가 현저히 낮아질 것이다. 현재 웹 개발은 DOM의 변경에 맞추어 렌더링도 여러번 하는 구조이다. 즉 DOM에 변경사항이 생겨서 DOM을 조작해야 한다면 모든 과정이 비용이다. 이런 이슈를 해결하기 위해 가상 DOM이 등장했다. ■가상 D..