1.为什么要用vuex?
组件通信的类型 父子通信 跨级通信 兄弟通信 路由视图级别通信
2.通信解决方案
props/refs/ref(父子通信)
parent(父子通信)
listeners(父子通信,跨级通信)
provide/inject (父子通信,跨级通信)
vuex(父子通信,跨级通信,兄弟通信,路由视图级别通信)
localStorage/dessionStorage 基于浏览器客户端的储存(父子通信,跨级通信,兄弟通信,路由视图级别通信)
eventBus()
3.vuex是什么
vuex是一个专为Vue.js 应用程序开发 状态管理模式 类似 redux
这种状态管理模式包含;
State:状态数据源
View:使用状态数据源的视图
Actions:修改更新数据源的操作
这种模式遵循的是 单项数据流 模式
4.vuex的工作流
-State : 存储应用状态数据(React 中的 State)
- Vue Component : 显示 <u>State</u>
- Actions : 提交修改 <u>State</u> 的动作(包括异步行为)(React 中的 action)
-
Mutations : 唯一更改 <u>State</u> 的位置(React 中的 Reducer)
5.安装 Vuex
npm i vuex / yarn add vuex
6.引入 vuex
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)