1.背景
最近在做一个单页面的管理后台项目，为了提高开发效率，使用了Vue框架来开发。为了使各个部分的功能，独立结构更加清晰，于是就拆分了很多组件，但是组件与组件之间数据共享成了一个问题，父子组件实现起来相对简单，prop，$emit，$on就能搞定。除此之外，有很多兄弟组件和跨多级组件，实现起来过程繁琐，在多人协同开发上，不利于统一管理，于是，开始了Vue的生态之一的Vux实践之旅。
2.概述
每一个 Vuex 应用的核心就是 store（仓库）。“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (state)。
Vuex 和单纯的全局对象有以下两点不同：
1.Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候，若 store 中的状态发生变化，那么相应的组件也会相应地得到高效更新；2.你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地了解我们的应用
3.安装使用
3.1.使用Vue-cli开发安装vue包
cnpm install vuex --save
3.2.在src目录下创建store文件夹并创建index.js如下(src/store/index.js)
import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex); export default new Vuex.Store({ state: { }, getters: { }, mutations: { }, actions: { } });
然后在src文件下的main.js中使用
import Vue from 'vue' import App from './App' import store from './store' Vue.config.productionTip = false
new Vue({ el: '#app', store, components: { App }, template: '<App/>' })
4.用法简介
4.1.state
state是保存共享数据的，现在改store/index.js如下：
** state: { count:0 }, **
在components目录下创建Index.vue如：
