vue 组件：全局注册和局部注册

最新推荐文章于 2024-09-02 15:51:54 发布

灵灵7

最新推荐文章于 2024-09-02 15:51:54 发布

阅读量4.2k

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/weixin_41796631/article/details/88991369

版权

这篇博客探讨了Vue中组件的全局注册和局部注册。全局注册的组件可以在Vue应用的任何地方使用，但会占用内存。局部注册的组件只在特定实例中有效，分为通过JavaScript对象注册和在实例的components属性中注册两种方式。在模块系统（如webpack）中，需要在main.js中导入并注册组件。

摘要由CSDN通过智能技术生成

全局组件: 如果想组件在任何地方都能应用，我们就需要注册全局组件
局部组件: 局部组件要挂载到实例元素（在实例中定义组件）上，否则没有效果

全局注册方式:
//注册
Vue.component('component-a',{
	template:'<div>我是全局注册的组件aaa</div>'})

new Vue({ el: '#app' })

//全局使用。
<div id="app">
  <component-a></component-a>
</div>



局部注册方式：
//注册
var aComp={}

//在实例中定义
var app=new Vue({
	el:'#app',
	components:{
		a-Comp:'aComp'
		}
	})

//在挂载的实例元素上使用。（上面挂载了“app”这个元素）
<div id="app">
  <component-a></component-a>
</div>

全局注册：

全局注册的组件，Vue 根实例 (new Vue) 的中使用。缺点：注册了的全局组件，就算不需要用到，仍会占用内存在注册之后可以用可以在任何新创建的
Vue.component('component-a', { /* ... */ })
Vue.component('component-b&