VUEX 是一种程序模式,来统一管理程序状态的。
诙谐点说: VUEX 就是一个女人对生活的一种态度,是一种管理、收纳自己用品的一种归置模式。

你喜欢把花放在电视机旁,她喜欢把花放到冰箱上,还有女人喜欢把衣服放到床上,等等等,都可以,这是一种归置的思想,电视剧、冰箱、床  这三个都是 容器,能容纳你放置的这些东西。

在VUE 里面也把这些个概念虚拟出来一个名称  叫做  Store,英文名字  Store 就是 仓储、容器的意思
那VUE 是通过什么来 虚拟这个 Store 的呢?通过new Vuex.Store({})来虚拟Store

VUEX 把虚拟的模式,为了具体化成为规定的仓库,就是 通过这个代码,他告诉这个女人,我要给你做一个容器了。

接下来,给这个女人做的容器,我给他起个名字 叫衣服厨子,  const store【衣服厨】= new Vuex.Store
女人为了和她的衣厨进行日常的生活,会和这个衣服厨进行打交道。
和衣橱生活的日中中包含   {    
    衣橱储物槽(state),   
    向衣橱储物槽放置东西这个行为(mutation) ,
    以及从衣物来源行为(Action)      
}

这个地方写代码的话可以是

state.js ( 衣服储物槽文件 )
    const state[储物槽] = {
     内衣槽,
     裤子槽,
     外套槽,
}

mutaion.js ( 向衣橱储物槽归置行为)
const mutations[行为集合] = {
     放到内衣槽行为 : function(state, payload ){
          state.内衣槽 = payload
     },
     放到裤子槽行为 : function(state, payload ){
          state.内衣槽 = payload
     }
}

这个 state 就是衣橱储物槽,目前所有的情况
payload 载荷,即为咱们要往具体的储物槽里面放置什么物品
这时候我们有个衣物来源行为归属

actions.js (女人填充填充衣橱行为)

const actions = { 
 买裤子({state, commit}, payload(此处为款式) ) {
      axios.post('去商场买', {  款式 }).then( res => {
           //买回来后干啥
           commit (' 放到裤子槽行为', XX款式裤子)
      })
 },
 洗内衣({state, commit}, payload(此处为款式) ) {
      axios.post('去商场买', {  款式  }).then( res => {
           //洗完干啥
           commit (' 放到内衣槽行为', XX款式内衣)
          })
 },
}

女人和衣橱的日常模式已经设定好了,则这个模式就是 VUEX 状态管理模式
(action.js) -> store.dispatch('买裤子行为', 牛仔裤);  -> (mutation)  ->  commit (' 放到裤子槽行为', 牛仔裤) -> (state)  state.牛仔槽 = payload(牛仔裤)

这个女人,出去了一趟,买了条牛仔裤,到和他的衣橱交互后,结果是,这个衣橱的槽里面,多了条牛仔裤
这个槽里面多了条牛仔裤,无论是这个女人,还是她的闺蜜,如果来他家打开这个储物槽,都能看到
这个 “能看到” 这个瞬间,就是

computed: {
     观察裤子槽 () {
      return this.$store.state.count  (出现了牛仔裤)
    }
  }