Vuex

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。
1.直接引入本地下载vuex.js文件

//快捷下载的方式--------------npm install vuex --save-dev

2.cdn加速

https://unpkg.com/vuex

3.在一个模块化的打包系统中，您必须显式地通过 Vue.use() 来安装 Vuex：

//commonjs规范
var Vue  = require('vue')
var Vuex = require('vuex')

//es6的使用方式
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

state --- 单一状态树
可以简单的理解成数据模型这个数据模型在整个应用中是唯一的
它是用一个对象包含了应用的所有的状态 (数据),至此,作为唯一数据源儿存在
每一个应用将仅仅包含一个vuex.store的实例,

mutations --- 状态更改
通俗来说,也就是进行数据的修改
更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutations 非常类似于methods和事件

使用vuex进行数据的操作
在vue组件中获取vuex的状态,每当 store.state.count 变化的时候, 都会重新求取计算属性，并且触发更新相关联的 DOM。

    
        
        
        
        
        
        
        
    

    
        

            
{{ count }}
            

                +
                -
            
        

    

mapState
当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。 为了解决这个问题，我们可以使用 mapState 辅助函数帮助我们生成计算属性

    
        
        
        
        
        
        
        
    

    
        

            
{{ count }}
            

                +
                -