state

Vuex的基本数据，用来储存数据和操作数据

 state: {
    userInfo: '',
  }

如何获取vuex的state对象中的属性呢？

方法一：插值表达式

1.$store.state.count

2.需要依赖vue的computed计算属性来实现。在vue的实际应用中，computed属性可以在输出前，对data中的值进行改变，因此，我们就是利用computed的这一特性，在组件中获取vuex的state对象中的属性

方法二：利用vuex的mapState数组形式的方法来获取

1.导入import { mapState } from ‘vuex’

2.使用computed

computed: {
//使用展开运算符遍历…
    ...mapState(['userInfo'])
  }

3.在需要渲染的地方使用双向绑定或插值语法 userInfo.xxx 取值

getters

getters从基本数据(state)派生的数据，相当于state的计算属性，可以用来获取数据，mapgetter经常在计算属性中被使用

Mutations

提交更新数据的方法，以同步的方式储存

mutations: {
    setUserInfo (state, value) {
      state.userInfo = value
    },
  }

使用commit改变state数据

this.$store.commit('setUserInfo' , res.data.data)

actions

异步的方式存储，无法直接修改仓库中的值，需要通过同步到mutations

actions: {
 # refresUserInfo是变量名可自定义

    refresUserInfo (store) {
      auInfo()  //封装的获取用户信息函数
        .then(res => {
          store.commit('setUserInfo', res.data.data) //使用Mutations的commit改变state数据
        })
        .catch(() => {})
    }

使用this.$store.dispatch(‘方法名’) 调用

在需要的地方直接调用该方法，可以减少代码代码冗余问题