SOURCE

// 初始化 vuex 实例（可以将这个放到其他文件里面去））
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
  	increment: state => state.count++,
    decrement: state => state.count--,
    //载荷
    increment1 (state, payload) {
      // payload 作为一个对象，更加可读，统一对象形式调用
    	state.count += payload.amount
  	}
  }
})

// 初始化子组件
const Counter = {
  template: `<p>{{ count }}</p>`,
  computed: {
    count () {
      return this.$store.state.count
    }
  }
}

// 初始化 vue 实例
const app = new Vue({
  el: '#app',
  // 把 store 对象提供给 “store” 选项，这可以把 store 的实例注入所有的子组件
  store,
  components: { Counter },
  template: `
    <div class="app">
     <button @click="increment">+</button>
     <button @click="decrement">-</button> 
     <counter></counter>
    </div>
  `
  ,
   methods: {
    increment () {
      store.commit('increment');
      // 载荷传入对象参数
      // 点击按钮之后就加了11了，而不是加1
      store.commit('increment1', {amount: 10});
    },  
    decrement () {
    	store.commit('decrement')
    },
  }
})

<div id="app" class="app">
   
</div>

.app{
  background-color:#ffffff
}