Vuex Getters Mutations Actions And Redux

• Getter

vuex中的getters的作用主要用来计算并且缓存state的衍生数据，在redux中并没有涉及到这部分，而是在react-redux中，在mapStateToProps中，把state映射成组件需要的数据，而且如果需要缓存衍生数据，还需要使用Reselect避免在组件update的时候做不必要的更新，而vuex中的getter可以直接把需要使用的衍生数据缓存起来跨组件多次使用，而且能使用function的形式动态计算

getters: {
  // ...
  getTodoById: (state, getters) => (id) => {
    return state.todos.find(todo => todo.id === id)
  }
}
store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }

• Mutations Must Be Synchronous

  主要是因为如果Mutations有异步修改state的行为，那么vuex devtool将无法记录到state的修改，可以想想Redux中的中间件logger是如何实现的，在dispatch action之前和dispatch action之后分别打印出store的state，如果修改state的行为是异步的，那么logger是无法记录到state的修改的，因为在修改发生之前已经记录了

• Actions

  在vuex中，触发异步操作是通过Action，Action的作用用文档里的话说就是

  Instead of mutating the state, actions commit mutations.

  也就是说Action是用来commit Mutations的，这其实相当于直接把redux-thunk结合到redux中，那么thunk的根本作用是什么呢？其实就是延缓求值，所以Action的作用不止是异步调用Mutations，而且还可以根据条件来调用Mutations