vuex

state

1. state就是一个存储vue中多个组件共享状态的容器，它是一个对象

getters

Vuex 允许我们在 store 中定义“getter”（可以认为是 store 的计算属性）。就像计算属性一样，getter 的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算。

1. getters接收两个参数，第一个为state，第二个可以是其他getter
2. 一般的使用方式：

const state = {
	student: {
		name: 'tom',
		age:18 
	},
	todos: [
      { id: 1, text: '...', done: true },
      { id: 2, text: '...', done: false }
    ]
}

// 简单的获取数据并返回
const getters = {
	name: state => state.name
}

//对数据做简单的处理并返回
const getters = {
	doneTodos: state => {
      return state.todos.filter(todo => todo.done)
    }
}

3. 通常在其他组件中使用时，我们会借助计算属性

computed: {
  doneTodosCount () {
    return this.$store.getters.doneTodosCount
  }
}

4. mapGetters辅助函数

import { mapGetters } from 'vuex'

export default {
  computed: {
  // 使用对象展开运算符将 getter 混入 computed 对象中
    ...mapGetters([
      'doneTodosCount',
      'anotherGetter',
      // ...
    ])
  }
}

mutation

1. 更改 Vuex 的 store 中的状态的唯一方法是提交 mutation
2. 每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)
3. handler回调函数接受两个参数，state和一个载荷（一般为一个对象）