vue基础2组件化

最新推荐文章于 2024-03-18 18:00:25 发布

前端搬砖达人

最新推荐文章于 2024-03-18 18:00:25 发布

阅读量152

点赞数

分类专栏： vue 框架学习文章标签： vue 组件

本文链接：https://blog.csdn.net/wyq12138/article/details/84330732

版权

vue 框架学习专栏收录该内容

2 篇文章 0 订阅

订阅专栏

vue组件化
1**.生出子**

 //声明入口组件 对象的方式
         var mybody={
            template:'<div>我是身体</div>'
        }
        var myfooter={
            template:'<div>我是尾部</div>'
        }

声明子

var App={
            template:'<h1>我是入口组件</h1>',
            //声明
            components:{
                'my-header':myheader,
                'my-body':mybody,
                'my-footer':myfooter
            },
            //调用
            template:`
                <div>
                     <my-header></my-header>
                    <my-body></my-body>
                    <my-footer></my-footer>
                </div>
            `
        }

3.使用子

new Vue({
            el:"#app",
            components:{//声明要用的组件们
                //key是组件名，value是组件对象
                app:App
            },
            template:'<app/>' //入口组件
        })