vue组件局部与全局注册的区别

 

//局部注册

var mycomponent = new extend({        <!--Vue.extend()是Vue构造器的扩展,调用Vue.extend()我们将创建一个组件构造器-->

template:"<div>我是局部注册</>"

})

new Vue({

el:"#app",

components:{                 <!--components是实现局部注册的属性-->

"my-component":mycomponent

}

}) <!--这样我们组件就能应用在id=app的标签里面,其他地方不能应用,会报错!

如果想组件在任何地方都能应用,我们就需要注册全局组件-->

//全局注册

var mycomponent  = new extend({

template:"<div>我是全局组件,能在任何地方应用哦</div>"

})

Vue.component("my-compoent",mycomponent)    <!--这样就注册了一个全局组件-->

new Vue({

el:"#app"

})

vue 的全局组件和 局部组件的更多相关文章

  1. Vue 组件&组件之间的通信 之全局组件与局部组件

    在上篇博客中介绍了组件,在注册组件的简写中就用到了全局组件 //注册组件的简写方式 Vue.component('my-componenta',{ template:'<h2>hello ...

  2. vue -全局组件和局部组件

    1.全局组件:Vue.component('标签名', 构造器名) Vue.component('mycpn', cpnC) 注:这种注册组件的方式是全局组件,可以在多个Vue实例中使用. 2.局部组 ...

  3. vue组件化初体验 全局组件和局部组件

    vue组件化初体验 全局组件和局部组件 vue组件化 全局组件 局部组件  关于vue入门案例请参阅 https://www.cnblogs.com/singledogpro/p/11938222.h ...

  4. 详解vue全局组件与局部组件使用方法

    这篇文章主要为大家详细介绍了vue全局组件与局部组件的使用方法,具有一定的参考价值,对此有需要的朋友可以参考学习下.如有不足之处,欢迎批评指正. vue全局/局部注册,以及一些混淆的组件main.js ...

  5. 前端(二十二)—— vue组件:局部组件、全局组件、父组件数据传到子组件、子组件数据传到父组件、父子组件实现todoList

    Vue组件 一.组件介绍 每一个组件都是一个vue实例 每个组件均具有自身的模板template,根组件的模板就是挂载点,根组件也可以显式书写模板,会替换掉挂载点 每个组件模板只能拥有一个根标签 子组 ...

  6. vue中的全局组件和局部组件的应用

    1全局组件 vue框架: https://www.vue-js.com/?tab=all 组件树 solt 内置分发组件 应用见局部组件 2局部组件 2.1局部组件的使用:生子 - 挂子 - 用子 & ...

  7. VUE3 之 全局组件与局部组件

    1. 概述 老话说的好:忍耐是一种策略,同时也是一种性格磨炼. 言归正传,今天我们来聊聊 VUE 的全局组件与局部组件. 2. 全局组件 2.1 不使用组件的写法  <body> < ...

  8. vue.js中的全局组件和局部组件

    组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能. 组件的使用有三 ...

  9. vue(3)—— vue的全局组件、局部组件

    组件 vue有局部组件和全局组件,这个组件后期用的会比较多,也是非常重要的 局部组件 template与components属性结合使用挂载 其中 Vmain.Vheader.Vleft.Vconte ...

  10. Vue组件之全局组件与局部组件

    1全局注册实例 <div id="app"> <com-btn></com-btn> <com-btn></com-btn&g ...

随机推荐

  1. js中创建对象的4种方法

    1.直接创建,不可复用式创建var obj = new Object(); obj.name = ""; obj.id = ""; 2.使用工厂方法来创建对象, ...

  2. Java笔记 #07# Hibernate Validator

    Hibernate Validator是Spring Boot默认附带的标准校验API(javax.validation)实现. 应用实例(配合切面) 采用注解定义切面.java @Aspect @C ...

  3. Springboot 配置类( @Configuration) 不能使用@Value注解从application.propertyes中加载值以及Environment为null解决方案

    最近遇到个场景,需要在使用@Bean注解定义bean的时候为对象设置一些属性,比如扫描路径,因为路径经常发布新特性的时候需要修改,所以就计划着放在配置文件中,然后通过@ConfigurationPro ...

  4. BZOJ5279: [Usaco2018 Open]Disruption

    题目大意:给你一棵n个节点的树,这n条边称为原边,另给出m条带权值的额外边,求删去每条原边后通过给出的m额外条边变回一棵树的最小价值.题解:看完题面以为是Tarjan连通性之类的题目,冷静分析后想到是 ...

  5. 详解docker中容器devicemapper设备的挂载流程

    事故起因 版本说明:本文中docker版本主要基于1.10版本,操作系统为centos7.devicemapper在文中缩写为dm. 某个用户的容器启动不起来,启动时候一直报错.通过docker lo ...

  6. 使用littleTools简化docker/kubectl的命令

    littleTools littleTools是我根据日常运维时编写的一个小工具,开源在了https://github.com/xuxinkun/littleTools上. littleTools包含 ...

  7. MemoryStream请求与接收

    //流请求 static void Main(string[] args) { Console.WriteLine("Hello World!"); //Console.ReadL ...

  8. Lintcode489-Convert Array List to Linked List-Easy

    489. Convert Array List to Linked List Convert an array list to a linked list. Example Example 1: In ...

  9. IOS高级开发之多线程(四)NSOperation

    1.什么是NSOperation,NSOperationQueue? NSOperation是一个抽象的基类,表示一个独立的计算单元,可以为子类提供有用且线程安全的建立状态,优先级,依赖和取消等操作. ...

  10. 肿瘤数据库除了TCGA,还有TCIA--转载

    TCIA就是基于TCGA数据开发的,不同的是TCIA只提供了20个癌种的免疫数据分析. 看网站首页的介绍就知道,这个数据库主要是根据TCGA的二代测序数据开发出来的.这里的20个癌种,点击每个柱子进去 ...