Composition API

Chocolajin·2023년 1월 21일
0

Vue3

목록 보기
6/7
post-thumbnail

Composition API

https://vuejs.org/api/

Composition API는 옵션(data, methos, ...)을 선언하는 대신 가져온 함수(ref, onMounted, ...)를 사용하여 Vue 컴포넌트를 작성할 수 있는 API 세트다.

  • 반응형 API (Reactivity API)
    ref(), reactive()와 같은 API를 사용하여 reactive state(반응 상태), computed state(계산된 상태), watchers(감시자)와 같은 것들을 만들 수 있다.

  • 라이프 사이클 훅 (Lifecycle Hooks)
    onMounted(), onUnmounted()와 같은 API를 사용하여 프로그래밍 방식으로 컴포넌트 라이프사이클에 접근할 수 있다.
    쉽게 말해서 라이프사이클 특정 시점에 이러한 함수로 코드를 삽입할 수 있다.

  • 종속성 주입 (Dependency Injection)
    예를 들어 provide()와 inject()는 Reactivity API를 사용하는 동안 Vue의 의존성 주입 시스템을 활용할 수 있게 해준다.

반응형 API (Reactivity API)

반응형 API는 말 그대로 반응하는 데이터와 관련된 API 세트다.

라이프 사이클 훅 (Lifecycle Hooks)

Vue 인스턴스나 컴포넌트가 생성될 때, 미리 사전에 정의된 몇 단계의 과정을 거치게 되는데 이를 라이프사이클(Lifecycle)이라 한다.
https://vuejs.org/guide/essentials/lifecycle.html#lifecycle-diagram

쉽게 말해, Vue 인스턴스가 생성된 후 우리 눈에 보여지고, 사라지기까지의 단계를 말한다.

Vue 인스턴스는 크게 생성(create)되고, DOM에 부착(mount)되고, 업데이트(update)되며, 없어지는(destroy) 4가지 과정을 거친다.

create → mount → update → destroy

profile
뱁새 개발자 황새 따라잡다

0개의 댓글