Upgrade to Pro — share decks privately, control downloads, hide ads and more …

おさらいVue Composition API

texdeath
November 21, 2019

おさらいVue Composition API

Vue3.xのRFCに導入されるVue Composition APIの紹介です。

texdeath

November 21, 2019
Tweet

More Decks by texdeath

Other Decks in Programming

Transcript

  1. Agenda 1. What is Vue Composition API? 2. Better Type

    Interface 3. Logic Extraction and Reuse 4. More Flexibility Requires More Discipline 5. まとめ 3
  2. Better Type Interface TypeScriptへのサポートが大幅に向上 CreateComponentを定義すると型推論が効くようになる 9 import { createComponent }

    from '@vue/composition-api'; const Component = createComponent({ // ͜ͷ಺෦Ͱܕਪ࿦͕ޮ͘Α͏ʹͳΔ }); const Component = { // ͪ͜Βͷίϯϙʔωϯτม਺಺Ͱ͸ܕਪ࿦͕ޮ͔ͳ͍ // ʢTypeScript͕VueͷίϯϙʔωϯτͰ͋Δͱ൑அͰ͖ͳ͍ͨΊʣ };
  3. More Flexibility Requires More Discipline • 柔軟性を高めるためには、多くの規律が必要 • 適切に運用しないと品質は大きく下がってしまう •

    VuexやRouterを組み合わせるとより難易度が上がる • JavaScriptのコアメカニズムに則った編成を心がける 11