vuex如何管理需要即时更新的全局变量

自己在使用vue练习开发的时候遇到全局变量无法即时更新的问题，查了资料之后得出结论使用vuex能够快速解决该问题，但是看了好多人讲解vuex的教程自己跟着去做都没解决自己想要的，最后找到一个比较容易理解的拿出来分享给大家，也顺便给自己做笔记了。

1.首先安装vuex  cnpm install vue --save

2.引入vuex  import Vuex from 'vuex';

3.只需要复制粘贴过去即可（最重要的别忘了需要初始化的时候把store写进去）

new Vue({
    el: '#app',
    router,
    store,//使用store
    components: { App },
    template: '<App/>'
})

 

 

 

//创建Store实例
const store = new Vuex.Store({
// 存储状态值
    state: {
    count: 1,
    flag:true
    },
// 状态值的改变方法,操作状态值
// 提交mutations是更改Vuex状态的唯一方法
    mutations: {
        increment (state) {
        state.flag = !state.flag;
// 变更状态
        state.count++
    }
},
// 在store中定义getters（可以认为是store的计算属性）。Getters接收state作为其第一个函数
getters: {
        done(state) {
            return state.count + 5;
        },
},
actions: { 
    increment (context) {
    context.commit('increment')
},
incrementAsync (context) {
// 延时1秒 
    setTimeout(() => {
        context.commit('increment')
    }, 1000)
}
}
})                    

 

// 要改变状态值只能通过提交mutations来完成

4.通过$store.state.flag方式来获取或操作自己需要管理的数据

 

如果大家有更好的方法或见解希望互相交流