通过 Prop 向子组件传递数据

prop 是你可以在组件上注册的一些自定义特性。

当一个值传递给一个prop特性的时候，他就变成了那个

组件实例的一个属性。

为了给博文组件传递一个标题，我们可以用一个 props 选项

将其包含在该组件可接受的prop列表中：

注册：Vue.component('blog-post', { props: ['title'], template: '<h3>{{ title }}</h3>' })

 

使用：<blog-post title="My journey with Vue"></blog-post> <blog-post title="Blogging with Vue"></blog-post> <blog-post title="Why Vue is so fun"></blog-post>

 

使用条件：new Vue({ el: '#blog-post-demo', data: { posts: [ { id: 1, title: 'My journey with Vue' }, { id: 2, title: 'Blogging with Vue' }, { id: 3, title: 'Why Vue is so fun' } ] } })

 

接口使用：<blog-post v-for="post in posts" v-bind:key="post.id" v-bind:title="post.title" ></blog-post>