官方推荐的数据框架：在vue的开发中 vue实现视图层的开发，vuex来实现数据层，实现数据共享
vuex是整个虚线的内容：当项目中多个组件中的数据传值很困难时，把公用的数据放到一个公共的空间去存储，某一组件改变了这个公共部分的数据内容，其他组件就能感知到，vuex虚线中的内容就是公共数据存储的区域
紫色State：所有的数据都存储到State中，组件要用到公用数据直接调用State就可以了(当需要改变数据时不能直接用组件去改变State里的公用数据)
黄色Actions：放置的异步操作和一些复杂的批量的同步操作
红色Mutations：里面放一个一个同步的对State的修改
组件修改数据必须先调用Actions，Actions做一些异步操作或者是批量的同步操作，Actions再去调用Mutations，通过Mutations去改变State里的数据，有时也可以绕过Actions让组件直接调用Mutations去修改State的数据
当组件调用Actions时是组件调用Dispatch方法来操作Actions
组件直接调用Mutations或者Actions调用Mutations是通过Commit方法调用Mutations
数据发生变化后 组件的内容也就变化
用vuex时可以用vue面板：Vue Devtoos做代码的调试
并在全局引入(main.js文件)：import引入
Vue对象中添加 store
使用格式：{{this.$store.state.city}}
改变 state 的值：
actions 里的第一个参数 ctx 是 changeCity 的上下文帮助 changeCity 方法拿到 commit，commit 里的 changeCity 是 mutations 里的 changeCity
mutations 中函数名不需要和组件调用 dispatch 里的方法名一样
mutations 里的方法也接受两个参数第一个是 state ，第二个是外部( actions 里的 changeCity 传入的第二个参数)传入的参数
数据简单的时候允许绕过 actions 直接调用 mutations 直接在组件中调用 commit 方法
vuex里的几个高级的api
mapState：
先引入：import { mapState } from 'vuex'
mapState 是指把 vuex 里的数据映射到组件里的计算属性 computed 中
图中就是把 city 这个(公用)数据映射到名字为 city 的计算属性中
之后就可以直接 this.city 这样用了
他也可以传入为一个 Object，意思是吧 vuex 中的公用属性 city 映射到组件的计算属性中，映射的名字是 currentCity
mapMutation:
先引入
在使用(用在 commit 方法的函数中)：意思是 mutation 中有一个 changeCity，把这个 changeCity 映射到组件中的名字也为 changeCity 里，之后调用 mutation 的 commit 方法就可以简化了(注释部分是 commit 方法)
vuex 里的 getters：它的作用有点类似于组件中的 computed 计算属性的作用，当需要根据 state 里的数据算出一些新的数据的时候就可以用 mapGetters 来提供新的数据 避免数据的冗余。用法同 mapState、mapMutation
vuex 里的 Module：当遇到非常复杂的业务场景比如有很多公用的数据在vuex里存储比如把所有的 actions 或 mutations 的数据都放到一个 actions 或 mutations 里存储，这个 actions 或 mutations 文件会变得非常庞大不易维护，这时可以借助 Module 来对这个文件进行拆分，拆分以后 moduleA 只需要存储A模块所对应的 state 存储和 mutations 等操作，moduleB 只需要存储B模块所对应的 state 存储和 mutations 等操作，而在创建 store 时候在对所有模块进行一个整合，所以维护性更好
