第1章: 書き換え前のコードの全体像を理解する
- 1.1 親コンポーネント(クラス形式)
- 1.2 子コンポーネント(クラス形式 / prop, emit 使用)
- 1.3 Vuexストア(state / mutation / action)
- 1.4 今回変換する対象を整理する
第2章: props / emit の基本書き換え (クラス → Composition API)
- 2.1 子コンポーネントのprops定義を
defineProps
に書き換える
- 2.2 emitを
defineEmits
で型安全に書き換える
- 2.3 親コンポーネント側のemit呼び出しを修正する
- 2.4 コード比較(Before / After)
第3章: Vuexの書き換え (mapState / mapMutations → useStore)
- 3.1 クラスでのVuex利用方法を振り返る
- 3.2 Composition APIでの
useStore
の基本
- 3.3 型付きuseStoreの作り方(コンポーザル関数
useCounterStore.ts
の設計)
- 3.4 コード比較(Before / After)
第4章: 親子コンポーネント + Vuex の組み合わせ変換
- 4.1 親子間データ受け渡し + Vuex利用を組み合わせた変換