第一次学习vuex

在学习vue的过程中总结了以下的知识点，有什么不对的地方希望可以留言指正
官方文档地址
vuex是什么呢？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。我的理解就是vuex就是存放公共数据的一个容器。

vuex核心主要分为5个：state、mutation、action、getter、module，个人理解
　（1）state主要是定义的状态，相当于vue里data里面的定义的参数，需要改判state状态值不能直接修改，需要使用mutation中修改，

//状态

const state = {
    userinfo: 'welcome to use',
}

在vue中取state的值我们可以根据辅助函数mapState来进行取值,列如

computed:{
//根据辅助函数mapState来获取state中的值
...mapState({
　　userinfo:state=>state.userinfo
})
}

（2）mutation 官方解释为：更改 Vuex 的 store 中的状态的唯一方法是提交 mutation，就相当于一个事件，只有提交了这个事件才能去改变state中的值

//mutations 主要用来操作state
const mutations = {
//修改state中userinfo的值
    UPDATE_USERINFO(state, userinfo) {
        state.userinfo = userinfo
        console.log(state.userinfo)
    },
}

在vue中修改state的值我们可以根据mutations 来修改vue页面调用mutations ,使用commit来提交，列如

this.$store.commit('UPDATE_USERINFO','要修改的值')

上面mutations 中接受到修改的
（3）action 官方解释为：（1）Action 提交的是 mutation，而不是直接变更状态（2）Action 可以包含任意异步操作，大概意思就是说，action主要操作为异步操作，异步操作完成要修改state中的值，不能直接去修改state中的值，需要根据mutation去修改state的值。

//action 异步请求数据，提交mutation来修改state中的userinfo状态
const actions = {
    //请求数据，异步请求经过promise改同步
    GET_USERINFO({ commit }) {
            axios.post('路由地址').then(res => {
                console.log(res)
                //更新mutations里面UPDATE_USERINFO方法的数据
                commit('UPDATE_USERINFO', res.data)
            })
        })
}，

vue中调用action

//在vue构造函数created调用
created（）{
this.getuserlist
}
 methods:{
//使用vuex的辅助函数mapActions调起vuex的action
        ...mapActions({
            getuserlist:'GET_USERLIST' //这个为action中的函数GET_USERLIST
        })
    }

（4）getter相当于一个计算属性，类如过滤

//使用getter赛选
 const getters ={
        filtUserList:state=>state.useslist.filter(v=>v.age>25)
 }