-
created
- 인스턴스가 작성된 후 동기적으로 호출
- 부모, 자식 관계의 컴포넌트가 렌더링 될 때 mounted 보다 먼저 호출되며 부모, 자식 순으로 실행
- 가상 DOM 을 건드릴 수 없습니다.
($el 속성 사용 불가)
- created 에서는 컴포넌트의 데이터 초기화 및 서버 요청과 관련된 작업
이 시점에서는 DOM에 접근할 수 없지만, 컴포넌트의 데이터와 메서드에 접근할 수 있기 때문에 데이터 관련 작업을 먼저 처리하고자 할 때 사용
mounted
- 인스턴스가 마운트된 후 호출
- 부모, 자식 관계의 컴포넌트가 렌더링 될 때 created 다음으로 호출되며 자식, 부모순으로 실행
- 모든 자식 컴포넌트가 마운트되었음을 보장하지 않음
(전체 화면내용이 렌더링될 때까지 기다리려면, mounted 내에 vm.$nextTick를 사용)
- 가상 DOM 을 건드릴 수 있습니다.
($el 속성 사용 가능)
- mounted 에서는 DOM이 완전히 렌더링된 후 호출되기 때문에 DOM 요소를 조작하거나, 외부 라이브러리와 상호작용할 때 사용
jQuery, D3.js, Chart.js 같은 외부 라이브러리와 연동할 때 유용
