十三、组件的分类

1.组件的分类

   分类:全局组件、局部组件
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件的分类</title>
    <script type="text/javascript" src="js/vue.min.js"></script>
</head>
<body>
    <div id="itany">
        <my-hello></my-hello>
        <my-world-one></my-world-one>
    </div>
</body>
<script type="text/javascript">
    // 全局组件,可以在所有vue实例中使用
    Vue.component('my-hello',{
        template:'<h3>{{name}}</h3>',
        data:function(){//在组件中存储数据时,必须以函数形式,函数返回一个对象
            return {
                name :'alie'
            }
        }
    })
    var vm = new Vue({
        el:'#itany',
        data:{
            msg:'wang'
        },
        components:{
            //局部组件 只能在当前vue实例中使用
            'my-world-one':{
                template:'<h3>{{name}}</h3>',
                data(){
                    return {
                        name:'beij'
                    }
                }
            }
        }
    })
</script>
</html>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容