vue.js组件问题

Question

<div id="app2">

        {{message2}}

        <parent></parent>

    </div>

    <script>

        var child2 = Vue.extend({

            template:'<p>this is child template</p>'

        })

        Vue.component('parent' , {

            template:'<p>this is parent template</p><child1></child1>',

            component:{

                "child1":child2

            }

        })  

        var vm2 = new Vue({

            el:"#app2",

            data: {

                message2 : "hello app2!"

            }

        })

        </script>

        

以上代码出现报错

求大神告知这为什么，应该如何修改，使得子组件里可以嵌套孙组件。

Answer 1

组件的template只能有一个祖先级节点局部注册组件使用components而不是component