我们把组件编写的代码放到构造器外部或者说单独文件我们需要先声明一个对象,对象里就是组件的内容。

var zdy = {   template:`<div>Panda from China!</div>`}

声明好对象后在构造器里引用就可以了。

components:{    " zdy ": zdy}

<zdy></zdy>

父子组件的嵌套

html

<div id="app">         <register></register>        </div>

js

 // 子组件 要在父组件前面        var city = {            template:`<div>{{message}}</div>`,            data:function(){                return{                  message:"这是子组件"                }             }        }        // 父组件        var parent = {             template:`<div><city></city>{{message}}</div>`,              data:function(){                return{                  message:"这是父组件"                }             },            components:{                "city":city            }        }               var vm = new Vue({                 el:"#app",                 data:{                 },                 //最后在这注册register组件                 components:{                    "register":parent                 }               })