通过 Prop 向子组件传递数据、监听子组件事件

1.通过 Prop 向子组件传递数据
Prop 是你可以在组件上注册的一些自定义 attribute。当一个值传递给一个 prop attribute 的时候，它就变成了那个组件实例的一个 property。
一个组件默认可以拥有任意数量的 prop，任何值都可以传递给任何 prop。
我们可以静态传参：

我们可以使用 v-bind 来动态传递 prop:

可以在子组件中字符串数组形式列出的 prop：

props: ['title', 'likes', 'isPublished', 'commentIds', 'author']

也可以给每个prop都可以指定值的类型：

props: {
  title: String,
  likes: Number,
  isPublished: Boolean,
  commentIds: Array,
  author: Object,
  callback: Function,
  contactsPromise: Promise // or any other constructor
}

当 prop 验证失败的时候，(开发环境构建版本的) Vue 将会产生一个控制台的警告。
2.监听子组件事件
父组件可以监听子组件的事件。父级组件可以通过 v-on 监听子组件实例的任意事件。
同时子组件可以通过调用内建的 $emit 方法并传入事件名称来触发一个事件。
有的时候用一个事件来抛出一个特定的值是非常有用的。这时可以使用 $emit 的第二个参数来提供这个值。然后当在父级组件监听这个事件的时候，我们可以通过$event访问到被抛出的这个值。或者，如果这个事件处理函数是一个方法，那么这个值将会作为第一个参数传入这个方法。

3.代码
使用脚手架ini一个vue项目：
vue init webpack learn-vue
切换到这个目录下：
cd learn-vue
启动项目:
npm run dev

主要添加的vue文件：
BlogPage.vue:

BlogPost.vue

学习链接：https://cn.vuejs.org/v2/guide/components.html