3.vue的组件

import Vue from  'vue'         表示引入了vue这个库并赋值给了Vue;  类似require

new Vue({

         el:"#app",

          template:"

Hello Word! {{ word }}

"，

          data:{

                   word: 'hello word'

           }

})

组件树：

实现组件注册和引入

全局注册组件：

Vue.component('my-header',{

        template:"

this is my header

"

})

调用组件:

局部注册：

注册：

var myHeaderChild = { 

        template:'

i am a headerChild

'

}

var myHeader = {

       template:"this is my header"，

       components:{

           'my-header-child' : myHeaderChild  

       }

}

data:  //组件赋值,这样做避免了引用赋值

        function(){

           return:{f:1,d:2}

       }

new Vue({

        el:"#app",

        data:{

              word:"hello word"

        }

       components:{     //局部注册组件

            'my-header':    myHeader

        }

})