Vuexとは
Vuexはアプリケーションのデータを一箇所で管理できるライブラリのことです。
Vuexの中心にはデータの状態保存しておくstoreというものがあります。
アプリケーション内のどのコンポーネントからアクセスできるため、アプリケーション全体で管理するものはstoreに保存しておきます。
storeを使用することで、コンポーネント同士の受け渡しの管理が複雑になるのを防げます。
storeの特徴
storeには以下のような特徴があります。
- storeの状態を変更すると、storeから値を取り出したときの値もリアクティブに変更される
- store内部は直接変更できない。変更はmutationをコミットすることでのみ可能になる
また、storeには4つ機能があります。
- state :データの状態を保存しておく。
- getter :stateの情報を取得する。
- mutation :stateの状態を更新する。stateの値を更新できるのはmutationのみ。
- action :mutationをコミットしたり、非同期処理を含むことができる。
補足:store導入方法
nuxtでは、Vuexストアはnuxtに付属しているのですぐに使用することができます。
sotreディレクトリの下にindex.jsファイルを作成することで、storeが有効化されます。
また、index.jsはルートモジュールになります。
参考