Lifecycle Diagram
Component Lifecycle
- Lifecycle: 컴포넌트는 웹 페이지에 표시가 될 때까지 일련의 step을 거침
- Create단계: 데이터만 존재하는 단계
- Mount단계: 사이에 있는 코드를 실제 HTML로 바꿔줌
- Component 생성 단계: index.html에 추가
- Update 단계: data변경 → 컴포넌트가 재 렌더링
- Unmount 단계: 컴포넌트가 삭제될때
- Lifecycle Hooks: 컴포넌트가 생명 주기를 거쳐 생성되고 사라지는 데 과정 마다 hook을 걸어서 코드를 실행 할 수 있음
- 서버에 데이터 요청 할 때 유용: created(), mounted()에서 주로 사용
- 그 밖에 함수들
- beforeCreate()
- created()
- beforeMount()
- mounted()
-
function() vs. ()⇒{} : 함수 안에서 this를 쓸때 function()대신 ()⇒{}로 쓸 것 mounted() { setTimeout(()=> { ..code.. }, 1000); }
- beforeUpdate()
- updated()
- beforeUnmount()
- unmounted()
'컴&프로그래밍 > Vue.js' 카테고리의 다른 글
Vuex (0) | 2021.10.09 |
---|---|
vue.js props, slot, slot-props, custom event, mitt (0) | 2021.10.09 |
vue.js 데이터바인딩 (0) | 2021.10.07 |