Nuxt TypeScriptでのAPI採用方法について

Nuxt TypeScript
https://typescript.nuxtjs.org/examples/class-api/basic.html

Nuxt.js TypeScriptは、
Options API、Class API、Composition API
の3つのAPIが存在していますが、
下記のVue.js発明者のEvanYouのコメントでVue3系では、Vue.extendは残り続けるが
TypeScriptを使う場合は、型推論の強化されたClass APIを使用したら良いと
コメントされています。
ということは、必然的にClass APIもしくは、Composition APIを使えば良いことになると思うのですが、TypeScriptが初めての為、どのAPIを採用したら良いか迷っています。
博識のある方、採用理由も添えてご教授して頂けませんでしょうか？

※ Nuxt TypeScriptでどのAPI方式を採用すれば良いか知りたいです。
Vue.jsでTypeScriptを使用する場合のAPI方式の採用方法についても
ご存知であれば雑学として知りたいです。

行動規範の内容に同意します

回答1件

ベストアンサー

新しく始められるのであれば、Classベースの提案は棄却されているため、Composition APIが良いと思います。

以下で、Classベースの問題について挙げられています。
https://github.com/vuejs/rfcs/pull/17#issuecomment-494242121
vue-class-componentのメンテナンスの問題も挙げられていました。

一方で、ClassベースはComposition APIより利用実績があると思います。
ClassベースでNuxt.jsを書いていますが、不都合を感じたのはvue-rxを使ったときぐらいです。
ClassベースでNuxt.jsを書く場合は、vue-class-componentをラップしているnuxt-property-decoratorがお勧めです。

投稿2019/09/12 13:29

編集2019/09/12 13:31

yuhigash

総合スコア327

laravel5

2019/09/13 00:47

今回も回答して頂きましてありがとう御座います。 Class API廃止になっていたのですね。知りませんでした。上記にキャプチャーを載せさせて頂いたのですが、現在は、Composition APIが有力ですが、 Vue3系が出るまではどうなるか分からないんですね！ Vue3系は、TypeScriptの連携強化をメインに対応すると記事を見たのですが、まだ過渡期なので、どのAPI方式を採用するか揺れている状態なのですね。 https://dev.to/voluntadpear/comparing-react-hooks-with-vue-composition-api-4b32

laravel5

2019/09/13 07:50

下記の記事の方法で上手く動作しましたので、 Composition APIを選定した上で、 tsx(JSX)でテンプレートもtypescript化して進めさせて頂きます！ https://qiita.com/nkjmsss/items/7c61193efe390c14aa16