13.父子组件

当我们继续在组件中写组件，形成组件嵌套的时候，就是我们所说的父子组件了。

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

<template id="mytemplate">
    <div>
        <h3>我是父组件</h3>
        <!-- 在父组件中使用子组件 -->
        <subcomponents></subcomponents>
    </div>
</template>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    let obj = {
        template: '#mytemplate',
        data() {
            return {}
        },
        components:{          //声明子组件
            subcomponents:{
                template:`<div>我是子组件</div>`
            }
        }
    };

    var vm = new Vue({
        el: '#app',
        components: { //声明局部组件
            mycomponent: obj //组件名:组件实例
        }
    });
</script>