vuex基本内容

 

1.vuex多个组件共享状态

以一个全局的单例模式管理，把组件的共享状态抽离出来，在这种模式下，组件树构成了一个巨大的"视图"，不管在树的哪个位置，任何组件都能获取状态或触发行为

通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性

Vuex是专门为Vue.js设计的状态管理库

2.vuex基本内容

Vuex应用的核心是store（仓库），"store"基本上就是一个容器，包含应用中的大部分状态（state）

3.Vuex和单纯的全局对象不同

Vuex的状态存储是响应式的，当Vue组件从store中读取状态的时候，若store中的状态发生变化，相应的组件会高效更新

不能直接改变store中的状态，改变store中的状态的唯一途径是显式的提交（commit）mutation，可以很方便的跟踪每一个状态的变化

4.创建一个最简单的store

一个初始的state对象和一些mutation

//如果在模块化构建系统中，确保在开头调用了Vue.use(Vuex)

const stroe = new Vuex.Store({
    state:{
        count:0
    },
    mutations:{
        increment(state){
            state.count++   //store.state获取状态对象
        }
    }
})

可以通过store.state获取状态对象，通过store.commit方法触发状态变更

store.commit('increment')
console.log(store.state.count)

追踪状态的变化，通过提交mutation的方式，不能直接改变store.state.count

store中的状态是响应式的，在组件中调用store中的状态需要在计算属性中返回即可，出发变化在组件中的methods中提交mutation