Java Scripts/Vue.js

Vue 3 Why the Composition API

HobbyCoding 2021. 12. 28. 07:31
728x90

There are currently three limitations you may have run into when working with Vue 2:

  • As your components get larger readability gets difficult.
  • 구성 요소가 커질수록 가독성이 어려워집니다.
  • The current code reuse patterns all come with drawbacks.
  • 현재 코드 재사용 패턴에는 모두 단점이 있습니다.
  • Vue 2 has limited TypeScript support out of the box.
  • Vue 2는 기본적으로 TypeScript 지원이 제한되어 있습니다.

 

When to use the Composition API?

  • You want optimal TypeScript support.
  • 최적의 TypeScript 지원을 원합니다.
  • The component is too large and needs to be organized by feature.
  • 구성 요소가 너무 커서 기능별로 구성해야 합니다.
  • Need to reuse code across other components.
  • 다른 구성 요소에서 코드를 재사용해야 합니다.
  • You & your team prefer the alternative syntax.

https://github.com/vuejs/composition-api

 

GitHub - vuejs/composition-api: Composition API plugin for Vue 2

Composition API plugin for Vue 2. Contribute to vuejs/composition-api development by creating an account on GitHub.

github.com

 

실제 composition API 를 이용한 sample codes 

 

 

The good

  • We’re writing less code, so it’s easier to pull a feature from your component into a function.
  • 코드를 적게 작성하므로 구성 요소의 기능을 함수로 가져오는 것이 더 쉽습니다.
  • It builds on your existing skills since you’re already familiar with functions.
  • 이미 functions 에 익숙함으로 기존 기술을 기반으로 합니다.
  • It’s more flexible than Mixins and Scoped Slots since they’re just functions.
  • 이는 단지 function 일 뿐이므로 Mixin 및 Scoped Slots보다 더 유연합니다.
  • Intellisense, autocomplete, and typings already work in your code editor.
  • Intellisense, 자동 완성 및 입력은 이미 코드 편집기에서 작동합니다.