[뷰 인스턴스 라이프 사이클] 라이프 사이클 ✈︎ 애플리케이션이 가지는 생명주기 🌀 뷰 인스턴스 라이프 사이클 라이프 사이클 (Life Cycle) 속성 : 인스턴스의 상태에 따라 호출할 수 있는 속성 라이프 사이클 훅 (Life Cycle Hook) : 각 라이프 사이클 속성에서 실행되는 커스텀 로직 | 뷰 생명 주기 표 뷰에서 제공하는 라이프 사이클 표이다. 하나씩 살펴보도록 하자. | 뷰 라이프 사이클 다이어그램 라이프 사이클은 크게 4가지로 나눌 수 있다. 1) 인스턴스 생성 2) 인스턴스 적용 3) 인스턴스 갱신 4) 인스턴스 소멸 1. beforeCreate 인스턴스 생성 후 가장 처음으로 실행되는 라이프 사이클 vue 인스턴스가 아직 정의되기 전으로 아직 접근할 수 없는 상태 2. crea..
[뷰 인스턴스의 유효범위] ⛳️ 뷰 인스턴스의 유효범위 뷰 인스턴스를 생성 시 HTML 의 특정 범위 안에서만 옵션 속성들이 적용되어 나타난다. 이를 인스턴스의 유효범위라고 한다. 즉, 뷰 인스턴스에 정의한 영역이 적용되는 영역을 의미한다. 이를 자세하게 이해하기 위해서 인스턴스 생성 시 화면에 어떻게 적용되는지 살펴보자. | 뷰 인스턴스가 화면에 적용되는 과정 1) 인스턴스 생성자 실행 - 인스턴스 옵션 속성인 el, data를 인스턴스에 정의하고 new Vue로 인스턴스를 생성한다. 2) el 에 인스턴스 적용 - 특정 화면요소 에 인스턴스 부착. ex. #app - > app id 를 가진 dom 영역에 인스턴스 적용하여 지정한 화면 요소와 그 이하 레벨의 화면요소에 값 치환하여 적용 3) 인스턴스..