Vuex（二）——关于store

一、总览

　　Vuex 应用的核心就是 store（仓库）。

　　"store" 包含着应用中大部分的状态(state)。

二、Vuex 和单纯全局对象的不同

1. Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候，若 store 中的状态发生变化，那么相应的组件也会相应地得到高效更新。

2. 不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交(commit) mutations。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地了解我们的应用。

三、一个例子

 <div id="app">
   <p>{{ count }}</p>
   <p>
     <button @click="increment">+</button>
     <button @click="decrement">-</button>
   </p>
 </div>

 // make sure to call Vue.use(Vuex) if using a module system

 const store = new Vuex.Store({
   state: {
     count: 0
   },
   mutations: {
       increment: state => state.count++,
     decrement: state => state.count--
   }
 })

 const app = new Vue({
   el: '#app',
   computed: {
     count () {
         return store.state.count
     }
   },
   methods: {
     increment () {
       store.commit('increment')
     },
     decrement () {
         store.commit('decrement')
     }
   }
 })

结果为：