vue-cliプロジェクトでvuexを使用する、vuexの詳細な使用

1つは、vuexとは

簡単に言えば、データの共有属性です

第二に、店舗について

「ストア」は基本的に、アプリケーションのほとんどの状態を含むコンテナーです。

とりあえず、状態を一般的なデータとしましょう、わかりやすいです〜

三、国について

状態はプロジェクトのグローバルデータ属性であり、これらの属性は応答します。つまり、属性が変化すると、状態は動的に応答します

第四に、ゲッターについて

Getterを使用すると、リストのフィルタリングやカウントなど、ストア内の状態からいくつかの状態を導出する必要があります。

Vuexを使用すると、ストアで「ゲッター」を定義できます（ストアの計算された属性と見なすことができます）。属性を計算するように、

ゲッターの戻り値は、依存関係に従ってキャッシュされ、依存関係の値が変更された場合にのみ再計算されます。

V.突然変異について

Vuexストアの状態を変更する唯一の方法は、ミューテーションを送信することです。Vuexのミューテーションはイベントに非常に似ています。各ミューテーションには、文字列イベントタイプとコールバック関数があります。このコールバック関数は実際に状態を変更する場所であり、最初のパラメーターとして状態を受け入れます

V.アクションについて

アクションは突然変異に似ていますが、違いは（それに焦点を合わせると、多くの面接担当者が尋ねます〜）：

1.送信は状態を直接変更するのではなく、突然変異です。

2.非同期操作を含めることができます。

6、モジュールについて

単一の状態ツリーを使用しているため、アプリケーションのすべての状態が比較的大きなオブジェクトに集中します。アプリケーションが非常に複雑になると、ストアオブジェクトはかなり肥大化する可能性があります。上記の問題を解決するために、Vuexではストアをモジュールに分割できます。各モジュールには、独自の状態、ミューテーション、アクション、ゲッター、さらにはネストされたサブモジュールが上から下に同じ方法で分割されています

セブン、使い方

これまでに多くの理論的知識について説明してきましたが、実際にそれをどのように使用するのかを見てみましょう。

最初はインストールすることです

（1）npm install vuex --save

（2）新しい倉庫

srcディレクトリに新しいフォルダを作成し、storeという名前を付けます。次に、そのフォルダの下にjsファイルを作成します。今でも彼をstoreと呼んでいます。スクリーンショットの方が便利です。