关于 Vuex，我们直接进入正题：

首先，我们创建一个 store 的文件夹，然后在该文件夹下创建 store.js。

store.js 是我们整个应用文件的入口。

这就是我们的 store。

在初始化的时候，它里面只有一个数据，叫做 count，值是0。

那么我们如果要修改这个数据，就要通过一个 mutations：

mutaitions 里面的函数，都会接受第一个参数为 state，因为我们在 mutations 里面做的事情，就是去修改这个 state。

第二个参数是你后续在调用它的方法，去传的参数，然后我们拿到了这2个参数之后，我们就可以去修改我们的 state。

创建好了 store 之后，我们要在应用入口里面加进去：

然后我们发现页面上，报错了：

意思就是说，Vuex 在创建一个 store 之前，要去使用 Vue.use(Vuex)。

我们可以看到，store 已经显示出来了，那么我们如果去使用它呢？

我们可以在应用里面直接调用 this.$store 这个全局对象。

因为 Vuex 会帮我们处理这个数据，在我们每个组件的内部，都会给它加上 this.$store 这个对象，它就是指向我们在应用入口里面去传入的那个 store 对象。

然后呢，我们就可以去调用 this.$store.state 去访问里面的 count 了。

那如果我们要修改 count，怎么办呢？

我们调用一个 mutations，就是通过 store 的 commit 方法。

commit 方法里面的第一个参数，就是 mutations 的名称。第二个参数就是我们要传入的 num。

这就是我们在组件内部去调用 store 的 commit 方法，去修改我们 mutations 的一个操作。

我们首先要声明一个 store，然后要在我们的应用入口放进去。

因为 Vue 是一个树状结构，你只有放在最外层，那么它下面所有的子节点，才都可以去拿到这个 store 对象。

如果你把它放到 Hello 组件里面，那么在我们的 App 组件里面就拿不到这个 store 对象。

因为 Hello 是 App 的子树，如果你放到 Hello 里面，它只能是 Hello 下面的所有节点都能拿到这个 store对象。

App是它的上层节点，它是拿不到的。

这就是 Vuex最基础的用法。

然后我们要修改一些东西：

我们首先创建 store 的时候，和 Vue-Router 一样，我们也要去 export 一个方法来创建store。

因为如果有服务端渲染，那么每次服务端渲染的过程当中，都要去新生成一个 store，不能每次都是去用同一个 store。

因为每次都用同一个 store，会有内存溢出的问题，就跟 Vue-Router 是一样的道理。

我比较推荐大家这么去做。

因为我们在同一个地方去创建这些东西，能够更好的去维护我们的代码。

不然的话，每次我们要修改一些东西，都要去对应的地方去找，就会让我们的效率有所降低。