打开项目的 src .. components 下面的 Posts.vue 这个组件 .. 在这里可以找个地方用一下刚才定义的 getInitialData 动作 .. 在组件被创建以后可以触发执行这个获取初始数据的动作 ..

在组件里面添加一个 created 方法 .. 它是组件的生命周期方法 .. 在方法里面，用一下 store 下面的 dispatch 去触发执行动作 .. 应用的 store 在组件里面是 this.$store .. 用一下它的 dispatch 方法 .. 要执行的动作告诉这个方法，名字是 getInitialData ..

打开 posts 下面的 actions.js， 在这个 getInitialData 这里，请求成功以后，可以把得到的响应输出到控制台上检查一下 ..

回到浏览器 .. 打开浏览器的控制台 ..

控制台上会输出用 axios 从服务端那里请求回来的数据 .. status 是状态码，这里是 200 ...

返回的具体的文章列表数据是在 data 这个属性里面 ..

headers 里的东西是响应回来的一些头部信息 .. 在为内容列表做分页功能的时候会用到这个 headers 里面的数据 ...

mapActions

在 Posts 这个组件的 created 方法里面，我们直接用了 store 里的 dispatch 触发了一个 getInitialData 动作 .. 我们也可以使用 vuex 提供的 mapActions 这个帮手方法，让组件的方法跟触发动作的行为做一下映射 ..

先在组件里面，把 mapActions 从 vuex 里面拿出来用一下 ..

然后在组件里添加一个 methods 属性 .. 一个对象参数 .. 它里面的东西就是组件需要用的一些方法 ..

这里可以用一个 spread 操作符，把 mapActions 返回的东西拿出来放到这个对象里面 .. 这个 mapActions 的参数可以是个数组，也可以是个对象 .. 如果是对象的话，我们可以设置一下组件方法的名字，还有对应的要执行的动作 ..

如果要执行的动作跟方法的名字一样 .. 可以用一个数组方法 .. 放一个 getInitialData ..

这样在这个 created 方法里面触发执行 getInitialData 动作的代码，可以换成 this.getInitialData ，就是执行一下这个组件里面的 getInitialData 方法，这个方法我们用 mapActions 帮手方法，跟触发执行 getInitialData 这个动作做了一下映射 .. 所以执行它们的效果是一样的 ..

回到浏览器 .. 刷新一下 ..

控制台上仍然会输出 getInitialData 这个动作获取到的数据 ...