我们把从数据库 notes 集合里查询出来的数据放到了 Notes 组件的 entities 里面了 .. 现在我们可以用 Note 组件去显示 entities 里的数据 ..

在 Notes 的模板里面，找到使用了 note 组件的地方 .. 我们先用一个 v-for ，去循环处理一下 entities 数据 .. entity in entities .. 每次循环的数据的名字叫 entity ..

这个 entity 我们可以传递给 Note 组件使用 .. 用一下 v-bind 绑定一个 entityObject .. 对应的值就是每次循环的时候表示当前项目的 entity .. 在 Note 组件的属性里面会有个 entityObject，它里面的东西就是单个笔记数据 ..

再用一下 v-bind 绑定一个 key ，每个项目的 key 的值应该不一样 .. 这里用一下 entity.$loki，这个 $loki 就是文档的 id 号 ..

Note

回到 Note 组件 .. 里面先添加一个 props ... 一个数组 .. 里面添加一个 'entityObject' ，它就是 Note 组件的爸爸，也就是 Notes 传递过来的一个属性的名字 ..

在组件里面我们不能直接修改 props 里的值 .. 所以，这里可以再添加一个 data 方法 .. 返回一个对象 .. 里面添加一个 entity ，对应的值就是当前组件的 props 里面 entityObject 这个属性的值 ..

现在我们可以在组件的模板里，用一下这个 entity 的值 .. 替换一下这个静态文字 .. 绑定输出一个 entity 下面的 body 属性 .. 它的值就是笔记的内容 ..

预览

现在，页面上显示的就是数据库里的 notes 集合里的所有的文档的 body 属性的值 ..