Vue Life Cycle

• 컴포넌트들은 웹페이지에 표시되기까지 일련의 Step을 거치는데 그 Step을 라이프사이클이라고한다.
  • create step : data만 존재하는 단계
  • mount step : <template>에 있던 것을 실제 HTML로 바꿔준다.
  • 컴포넌트 생성 step : index.html에 장착한다.
  • update step : data가 변하면 컴포넌트가 재렌더링된다.
  • unmount step : 컴포넌트가 삭제된다.

Life cycle Hook

• Step 중간에 Hook을 걸 수 있다.
• mount 전에 이런걸 실행 .. 등등
• 훅 쓸라고 라이프 사이클을 배운 것이다.

• 많은 훅 함수들이 있다.

  mounted() {
    setTimeout(() => {
      this.showDiscount = false;
    }, 2000);
  },

• 이런식으로 훅을 걸어서 2초 후에 Discount UI를 Display하지 않을 수 있다.
• 서버에 데이터 가져올 때도 lifecycle hook 안에 코드를 짠다.