vuex

1、为什么要用 vuex ？

组件通信的类型

• 父子通信
• 跨级通信
• 兄弟通信
• 路由视图级别通信

2、通信解决方案

• props/$emit（父子通信）
• $refs/ref（父子通信）
• $children/$parent（父子通信）
• $attrs/$listeners（父子通信、跨级通信）
• provide/inject（父子通信、跨级通信）
• eventBus（父子通信、跨级通信、兄弟通信）
• vuex（父子通信、跨级通信、兄弟通信、路由视图级别通信）
• localStorage/sessionStorage等基于浏览器客户端的存储（父子通信、跨级通信、兄弟通信、路由视图级别通信）

3、vuex 是什么？

Vuex 是一个专为 Vue.js 应用程序开发的 状态管理模式，类似 redux

[外链图片转存失败,源站可能有防盗链机

这种状态管理模式包含：

• State : 状态数据源
• View : 使用状态数据源的视图
• Actions : 修改更新数据源的操作

这种模式遵循的是 单向数据流 模式

4、vuex 的工作流

• State : 存储应用状态数据（React 中的 State）
• Vue Component : 显示 State
• Actions : 提交修改 State 的动作（包括异步行为）（React 中的 action）
• Mutations : 唯一更改 State 的位置（React 中的 Reducer）

5、安装 vuex

npm i vuex
// or
yarn add vuex

6、引入 vuex

通过 <script> 引入

<script src="vue.js"></script<