(7)Vue之vuex

1、什么是vuex？

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

2、Vuex状态管理图例

3、vuex插件的简单使用

安装vuex : npm install vuex --save

1:创建store文件夹，并创建index.js文件。

>总结:虽然这样能改共享的值，但是devtools追踪不到。官方不建议这样改，看上面的管理图例，改值必须要在mutations哪里改，如下图

官方推荐方法:

4、mutations参数

传参数，如当我们需要传参数给mutations方法时。

如果参数不是一个呢，是多个。也就是payload是一个对象

mutations另一种提交风格

Mutation响应规则



可以发现点击增加数据后，vuex变了，但是页面却没有发生响应式改变。

解决方法

抽取mutations方法名称为单独一个文件mutations-types.js。

为了解决这个问题，需要使用actions属性。

5、actions参数

从打印信息可以知道这里context对象为store

6、Module

例子1之mutations用法

例子2之actions用法

7、项目结构

一般我们都会把vuex内容抽取成每一个js文件

例子