第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利用を組み合わせた変換