Vuex 同步函数 异步函数 getters

store.js:

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
  	personList:[
    {
      name:'锦觅',
      sex:'女'
    },
    {
      name:'旭凤',
      sex:'男'
    },
    {
      name:'鎏英',
      sex:'女'
    }
    ]
  },
  getters:{
      girlNum(state){
        return state.personList.filter(item=>item.sex=='女').length
      }
  },
  mutations: {	//放同步函数的地儿
  	add(state,person){
      state.personList.push(person)
    }
  },
  actions: {	//放异步函数的地儿
   add2s(context,person){
     setTimeout(item=>{
       context.commit('add',person)
     },2000)
   }
  }
})

App.vue:

<template>
  <div id="app">
    <h1>App标题</h1>
    <div>姓名：<input type="text" v-model='name'></div>
    <div>性别：<input