使用组件
在Vue中，可以用 Vue.extend() 创建一个组件构造器：
var MyComponent = Vue.extend({
template:'..........' //选项
})
要把这个构造器用作组件，需要用 Vue.component(tag, constructor) 注册 ：
// 全局注册组件，tag 为 my-component
Vue.component('my-component', MyComponent)
在注册之后，组件便可以用在父实例的模块中，以自定义元素 < my-component > 的形式使用。要确保在初始化根实例之前注册了组件：
<div id="example">
<my-component></my-component>
</div>
demo
<div id="app">
<my-component></my-component>
</div>
var MyComponent = Vue.extend({
template:"<div>A custom component</div>"
});
Vue.component("my-component",MyComponent);
new Vue({
el:"#app"
});
Props 传递数据
组件实例的作用域是孤立的。这意味着不能并且不应该在子组件的模板内直接引用父组件的数据。可以使用 props 把数据传给子组件。
“prop” 是组件数据的一个字段，期望从父组件传下来。子组件需要显式地用 props选项声明 props：
Vue.component('child', {
// 声明 props
props: ['msg'],
// prop 可以用在模板内
// 可以用 `this.msg` 设置
template: '<span>{{ msg }}</span>'
})