Head first into composition API

Head first into composition API

A live coding demo to showcase Vue Composition API and maybe address FUD if that’s still relevant.

Resources:
https://vue-composition-api-rfc.netlify.com
https://github.com/vuejs/composition-api
https://github.com/znck/dogsay

1135c452bcb851741181b804cd184972?s=128

Rahul Kadyan

December 14, 2019
Tweet

Transcript

  1. Composition API

  2. Why do we need one more API?

  3. We had problems! Code Organisation Logic Extraction

  4. Options Based API Component Logic can be split in 6-10

    options. data, props, computed, methods, watch and life cycle methods
  5. Logic Extraction There is no efficient logic extraction mechanism in

    current API.
  6. Problems with Mixins Namespace Collision Obscure and unclear origin

  7. Problems with Mixin Factories Namespace Collision Obscure and unclear origin

  8. Problems with Scoped Slots Locked in Templates Multiple Sources Limited

    Intellisense
  9. Problems with Type Inference this type is complex Limited Intellisense

  10. How does Composition API solve this?

  11. Crash Course JavaScript define function call functions

  12. Crash Course Composition API define function call functions

  13. Code

  14. Resources vue-composition-api-rfc.netlify.com github.com/vuejs/composition-api github.com/znck/dogsay