VUE3（十）组件化开发

局部组件

局部组件需要在使用的组件中声明。声明方式是在要用到的组件中添加components属性，并以组件名-组件对象名的键值对定义。

    <template id="my-app">
        <h2>{{message}}</h2>
        <component-a></component-a>
    </template>

    <template id="component-a">
        <h2>我是组件A</h2>
        <p>我是内容，哈哈哈</p>
    </template>

    <script src="../js/vue.js"></script>
    <script>
        const componentA={
            template: "#component-a"
        }
        const app={
            template:"#my-app",
            data(){
                return{
                    message: "hello world"
                }
            },
            components:{
                // key：组件名称
                // value：组件对象
                componentA: componentA
                // 语法糖可以只写value（因为一般情况下key和value相同）
            }
        };
        const App=Vue.createApp(app);

        App.mount("#app");
    </script>