Posts 组件被创建以后，会触发 getInitialData 动作 ..

这个动作会用 axios 向服务端请求数据 .. 成功以后会 commit 一个修改 ... 修改的类型是 setInitialData .. 它做的事就是把数据里的 entities 的值设置成请求响应回来的 data 属性里的值 ..

回到控制台 .. 打开响应里面的 data 属性 .. 这里的东西就是一组文章内容 ..

每个内容里面都有很多属性 .. 一会儿我们可以用一下 title 这个属性里的 rendered .. 它就是文章内容的标题 ..

回到项目 .. 打开 Posts 组件 .. 在组件里面，可以添加一个 computed 属性 .. 它是一个对象 ..

里面添加一个 entities 方法 ..

这个方法可以返回 store 里的 posts 里面的 entities 数据 ..

这样在这个组件的模板里面，我们就可以使用这个 entities 数据了 .. 一组 div .. 里面再添加一组 div .. 上面用一个 v-for ，循环一下 .. entity in entities .. 每次循环的时候当前的项目的名字叫 entity ..

在添加一个 v-bind:key 绑定一个 key ，为每个项目绑定的这个 key 的值应该是唯一的 .. 这里我们可以使用 entity 里的 id 这个属性 .. 因为每个文章项目的 id 属性的值都不一样 ..

元素里面用两个大括号 .. 绑定输出一个数据 .. 就是 entity.title 下面的 rendered ..

回到浏览器，预览一下 ..

页面上会显示一组标题内容 .. 这组标题就是从后端服务那里请求回来的文章列表里的标题 ...

打开网站的管理后台 .. 在文章管理界面 .. 可以创建一个新的文章内容 ..

输入一个标题 ... hello ~

发布一下这个内容 ..

再回到 vue 项目的预览 ... 刷新一下页面 ..

页面上会显示刚才我们在网站后台新发布的这个文章内容的标题 ...

mapState

vuex 里面提供了一个 mapState 帮手方法，可以去用一下 .. 先把它从 vuex 里面拿出来用一下 ..

在这个 computed 属性里面 ，一个 spread 操作符，把 mapState 返回的东西拿出来放到这个 computed 里面 ..

一个对象参数 .. 添加一个 entities .. 它的值是个箭头函数 .. state 表示 store 里的那个 state，也就是应用的数据 .. 返回 state 里面的 posts 下面的 entities ..

再回到浏览器预览一下 .. 页面上仍然会显示之前的文章列表 ...