component: props

by edith_tang

HTML

<div id="app">
  <input type="text" v-model="favBook">
  <hr>
  <my-component message="信息" msg-content="这是来自父级的信息" :favorite ="favBook"></my-component>
  
</div>

JavaScript

Vue.component('my-component', {
	props: ['message', 'msgContent', 'favorite'],
  template: '<div><p>{{ message }}：{{ msgContent }}</p><p>My favorite book is: {{ favorite }}</p></div>'
});

var app = new Vue({
	el: '#app',
  data: {
  	favBook: ''
  }
})