vue 라이프 사이클( do it Vue.js 입문)

beforeCreated 

인스턴스 생성 후 가장 첫 라이프 사이클 단계 data,methods 속성이 아직 인스턴스에 정의되지 않음, DOM에 접근 불가

created 

data, methods 속성이 정의되어 this.data처럼 접근 가능 , 인스턴스 화면 부착전. 따라서 template 속성에 정의된 DOM요소로접근 불가 서버에 데이터 요청하여 받아오는 로직 수행하기 좋은 단계.

beforeMount 

템플릿 속성에서 지정한 마크업 속성을 render()로 변환 후 el 속성에 지정한 DOM에 인스턴스 부착 직전에 수행되는 단계 즉,render() 호출 직전 수행할 로직 구현 적합

mounted 

el에 지정한 DOM에 인스턴스 부착된 후 호출되는 단계 DOM에 접근 가능, 화면 요소 제어하는 로직 적합 beforeUpdatd - 관찰 중인 데이터가 변경되면 가상DOM으로 렌더링 직전 호출되는 단계. 변경 예정 데이터의 값과 관련된 로직 미리 넣을 수 있음 Updated - 가상 DOM으로 화면 그리고 나면 실행되는 단계 즉, 변경 완료된 시점 -> 데이터 변경 후 DOM제어와 관련된 로직 추가하기 좋음

beforeDestroy

뷰 인스턴스 파괴 직전, 아직 인스턴스 접근 가능. 따라서 인스턴스의 데이터 삭제 로직 적합

destroyed 

뷰인스턴스 파괴 후 호출됨