すべてのVuexアプリケーションの心臓部は、店舗（倉庫）にあります。「ストア」基本的に、あなたのアプリケーションのほとんど含まれていた容器で、ステータス（状態を）。Vuexとシンプルなグローバルオブジェクトは異なる以下の2点があります。
-
Vuex状態は、ストレージに応答します。コンポーネントは、ストアからVueの状態を読み取る場合、ストアは状態の変化は、それぞれのコンポーネントが更新された場合に応じて効率的に得られます。
-
あなたは、直接ストアの状態を変更することはできません。店舗のステータスを変更する唯一の方法は、明示的である（コミット）突然変異を提出します。だから我々は簡単に私たちは私たちがより良い私たちのアプリケーションを理解するのに役立ついくつかのツールを達成することができますのでことを、それぞれの状態の変化を追跡できること。
＃最も簡単な店
アセンブリ内のアプリケーション1）Vuex
<テンプレート>
<のdivクラス= "ホーム">
<P> {{この。$のstore.state.count}} </ P>
楽しい学習</ button>の<ボタン@ = "addFun" をクリックしてください>
<HelloWorldのMSG = "あなたのVue.jsアプリケーションへようこそ" />
</ div>
</テンプレート>
<スクリプト>
// @ / SRCにエイリアスがあります
"@ /コンポーネント/ HelloWorld.vue" からインポートHelloWorldの。
輸出のデフォルト{
名前：「ホーム」、
成分：{
こんにちは世界
}、
方法：{
addFun（）{
。この$のstore.commit（ "増加"）。
}
}
}。
</ SCRIPT>
2）/store/index.js
「表示」からインポートビュー
「vuex」からインポートVuex
Vue.use（Vuex）
{（デフォルト新しいVuex.Storeをエクスポート
状態：{
カウント：0
}、
変異：{
インクリメント（状態）{
state.count ++
}
}、
行動： {
}、
モジュール：{
}
}）
