vuex是什么?

Vuex

什么是vuex

vuex是一个专为 Vue.js 应用程序开发的状态管理模式， 采用集中式存储管理应用的所有组件的状态，解决多组件数据通信。

要点:

1. vue官方搭配，专属使用 (类似于：vue-router)，有专门的调试工具
2. 集中式管理数据状态方案 (操作更简洁)data() { return { 数据, 状态 }}
3. 数据变化是可预测的 (响应式)

小结:

vuex是vue官方提供的独立组件体系之外的,管理公共数据的工具

Vuex的学习内容

1. state： 统一定义公共数据（类似于data(){return {a:1, b:2，xxxxxx}}）
2. mutations ： 使用它来修改数据(类似于methods)===更改state中的数据必须使用mutations来进行更改
3. getters： 类似于computed(计算属性，对现有的状态进行计算得到新的数据-------派生 )
4. actions： 发起异步请求
5. modules： 模块拆分

Vue项目使用Vuex流程简化图(必会,重点记忆)

怎样在Vue项目使用Vuex

1. 在老项目中使用,先额外安装vuex包,然后进行配置.
2. 在新项目中使用,在配置vue-cli中创建项目时,可以直接选中vuex项,这样就不用做任何配置(脚手架会自动帮我们完成)

如何在旧项中使用vuex

步骤:

1. 安装. 它是一个独立的包,需要先安装

2. 配置 新建一个store文件夹,新建index.js文件;

   创建Vuex.store实例(有固定代码,类似 vue-route; 需要记忆)

   向Vue实例注入store

3. 使用. 在组件中使用store this.$store.state

安装包

npm install vuex

开发依赖 ： npm i xxxx