vuex的概念及安装下载使用

vuex的概念及安装下载使用

Vuex是什么？

vuex 是一个专为 Vue.js v应用程序开发的状态管理模式。Vuex背后的基本思想就是我们所说的单向数据流。vuex是一个集中式的存储仓库【状态】，类似于 本地存储、数据库，vuex是vue的状态管理工具，它的功能主要是实现多组件间的状态【数据共享】。

什么是状态？

用一条数据去管理一个视图或是视图中的一部分，那么我们就将这个数据称之为状态

什么是状态管理？

用一条数据去管理一个视图或是视图中的一部分，那么我们就将这个数据称之为状态，这种管理的形式我们称之为 状态管理

什么情况下我应该使用 Vuex？

	Vuex可以帮助我们管理共享状态，并附带了更多的框架概念，这需要对短期和长期效益进行权衡。

	如果你不打算开发大型单页应用，使用vuex可能是繁琐冗余的。确实如此如果您的应用够简单，您最好不要使用Vuex。一个简单的state模式就够您所需了 
     但是，如果您需要构建一个中大型单页面应用，您可能会考虑如何更好的在组建外部管理状态 ，    Vuex就成了自然而然的选择

Vuex的工作流程

	在vue的组件中通过dispatch来调用actions中的方法，在actions中通过commit来调用mutations中的方法，在mutations中可以直接操作state中的数据，只要state中的数据发生改变就会立刻响应到咱们的组件中。（附Vuex的流程图一份）	

veux的安装使用

npm install vuex --save

在一个模块化的打包系统中，您必须显式地通过 Vue.use() 来安装 Vuex：
1、我们可以在项目中的src目录中新建===> store目录 ===>index.js

	import Vue from 'vue'
    import Vuex from 'vuex'
    Vue.use(Vuex)
     //生成对象
    const  store = new Vuex.Store({
           state:{},
           mutations:{},
           actions:{},
           getter:{}
      })
   //抛出对象
  export default  store;

2、在main.js中完成全局注册

  import store from './store'
          new Vue({
              el:"#app",    
              router,
              store, //**在这个地方一定要注册
              components,
              template: '<App/>'    
           })

当使用全局 script 标签引用 Vuex 时，不需要以上安装过程

Vuex核心概念：

state：是仓库 也就是储存数据的   相当于银行的金库
       在组件中使用state中的数据 { this.$store.state }
mutations: 是唯一可以修改vuex中数据的选项。每个方法都有一个回调函数，回调函数有一个形参state 也就是咱么state中的数据
           在组件中触发mutations中的方法{ this.$store.com    mit("方法名字",参数)  }
actions: 不能直接修改状态值调用mutations的方法 mutations修改状态值   可以包含异步操纵
         在组件中触发actions的方法：{ this.$store.dispatch("方法名"，参数) }
getters: 类似我们的计算属性   可以针对state中的数据做一些逻辑计算
         在组件中使用方法：{ this.$store.getter.方法名 }
Module: Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块——从上至下进行同样方式的分割。

都是自己总结的，希望可以帮助到大家。有什么问题大家可以在评论区留言。