vuex用法（个人理解，还在学习）

vuex是什么？
状态管理
它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。


就是前端的数据库
当组件之间的关联度比较低的时候，有想获取其中的数据，项目有比较大的时候，就比较适合使用vuex，这个比较占内存
用户将想要操作的数据先存储到里面，其他的组件就可以获取里面的数据

那么问题来了，怎么存储呢？怎么获取里面的数据呢？

vuex怎么使用?

1.首先呢，先要安装vuex的包，
这里就不做实例了
2.在store里面新建对应的文件
2.1 action  ---用户通过action的操作，改变state的数据  
2.2 getter  ---其他组件通过getter里面的方法获取state的数据
例如：
export const singer = state => state.singer   

2.3 index ---vuex的入口文件

-----------例如-------

import Vue from 'vue'
import Vuex from 'vuex'
import * as actions from './actions'
import * as getters from './getters'
import  state from './state'
import  mutations from './mutations'
import createLogger from 'vuex/dist/logger'


Vue.use(Vuex)

export default new Vuex.Store({
  actions,
  getters,
  state,
  mutations
 

})

2.4 mutation-types  ---用户向state存储数据的时候的类型
例如：
export const  SET_SINGER='SET_SINGER'


2.5 mutation   ---用户通过mutation想state的类型
例如：
import * as types from './mutation-types'


const matutions={
  [types.SET_SINGER](state,singer){
    state.singer=singer
  }
}

export default matutions


2.6 state ---临时存储的数据

const state = {
  singer: {},
  
}

export default state

3.在main里面导入store
new Vue（{store}）

4.向state里面存储数据
组件通过vuex提供的语法糖，...mapMutations （相当于this.$store.commit('xxx')）
...mapMutations（{
setSinger：‘SET_SINGER’ //方法名，执行mutation-types里面的什么的操作，实际执行的是mutations的方法，
}）
组件里面的方法直接调用setSinger（item），就可以将item存入到state里面


5.向state里面获取数据
组件用vuex提供的...mapGetters方法，通过getter里面的方法， 获取state里面的数据
...mapGetters([ 'singer' ])  //对应的数据就是state里面的singer，用户可以直接将数据赋值给dom