Vue 2.7 では
クラスコンポーネント(OOP的)
Composition API(関数的)
の両方が使える。
しかし今後の Vue の主流は
✅ Composition API。
Vue 3 以降では 公式が Composition API 推奨。
→ 長期的にみると 保守性・拡張性が高い。
| 課題 | 内容 |
|---|---|
| 型推論が弱い | this の型が複雑になる |
| ライフサイクルごとに書く必要がある | mounted, created に分かれて見通しが悪くなる |
| ロジックの再利用が難しい | mixin が必要(わかりにくい / 衝突しやすい) |
| Vue 3 以降で非推奨の流れ | Vue 3 では Decorator が公式サポートされていない |
| 特徴 | 内容 |
|---|---|
| 型推論が強い | ref / computed で型がはっきりわかる |
| ロジックの再利用が簡単 | useXXX という composable にまとめられる |
| コードが整理しやすい | 関連する処理(data, computed, methods)を1か所にまとめられる |
| Vue 3 以降もそのまま移行可能 | 将来の Vue バージョンでも安心 |
Vue 3 の公式ドキュメントでも「Composition API の採用を推奨」。
クラスコンポーネントは今後メンテナンス対象外。
Vue 2.7 でも Composition API が公式対応されているのは