了解です!
では続けて 第5章 5.5 まとめ:なぜこの設計が安全で強いのか? に進みます。
ここまでで、
useStore) へuseCounterStore.ts) へuseUserStore.ts など) へというステップで変換してきました。
ここではその設計全体を振り返り、
「何がどう良くなったのか?」 を整理します。
| 課題 | この設計での解決方法 |
|---|---|
this の使いすぎ / 型エラー多発 |
Composition API で this 不要 → 型エラー激減 |
| mutation名 / action名 の typo | 関数名で呼ぶ → タイポしても補完で気づける |
| コードが長い・わかりにくい | useXXXStore.ts で関数にまとめてスッキリ |
| どのstate/mutationがどのモジュールかわかりにくい | モジュールごとに useCounterStore(), useUserStore() で責任範囲が明確 |
| 再利用がしづらい | コンポーザル関数にすることで どこでも同じ関数で使い回せる |