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