了解です!

ではそのまま続けて 第5章 5.1 なぜコンポーザル関数が必要なのか? に進みます。


第5章 5.1 なぜコンポーザル関数が必要なのか?

ここでは、「なぜわざわざコンポーザル関数(useCounterStore.ts など)を作るのか?」 その理由とメリットを整理します。


🎯 【結論】コンポーザル関数は「安全」「短い」「わかりやすい」を実現する道具

目的 コンポーザル関数で得られること
タイポ防止 mutation名やaction名を関数名で管理できる
型安全 引数や返り値の型が補完される
コードの短縮 毎回 store.commit('xxx') と書かなくてよい
再利用性 どのコンポーネントでも同じ関数が使える
読みやすさUP 親コンポーネントがシンプルになる(Vuexの存在を意識しない)
保守性UP mutation名変更時に一か所直すだけで済む

🟢 【具体的な問題点(コンポーザル関数なしの場合)】

store.commit('increment');
store.commit('increment');
store.commit('increment');


🛠️ 【コンポーザル関数ありだと?】

const { increment } = useCounterStore();

increment();
increment();
increment();