Vue.use()和Vue.component()

当很多页面用到同一个组件,又不想每次都在局部注册时,可以在main.js 中全局注册

Vue.component()一次只能注册一个组件

javascript 复制代码
import CcInput from '@/components/cc-input.vue'
Vue.component(CcInput);

Vue.use()一次可以注册多个组件

对于自定义的组件,如果不想在每个页面都引入一次,可以使用Vue.use()方法进行注册。

注册插件的时候,需要在调用 new Vue() 启动应用之前完成

Vue.use会自动阻止多次注册相同插件,只会注册一次

假设有两个自定义的组件:cc-input, cc-button

myUI/components中定义组件

在main.js中:

javascript 复制代码
import MyUI from '/myUi';
Vue.use(MyUi);

myUi/index.js:

javascript 复制代码
import CcInput from './components/cc-input';
import CcButton from './components/cc-button';

const components = [
	CcInput,
	CcButton
]

const MyUI = {
	install(Vue) {
		components.forEach(component => {
			// 注册组件
			Vue.component(component.name, component);
		});
	}
}

export default MyUI;
相关推荐
艾小码16 分钟前
手把手教你实现一个EventEmitter,彻底告别复杂事件管理!
前端·javascript·node.js
幸福摩天轮25 分钟前
npm发布包
前端
前端AK君28 分钟前
Gitlab 线上合并冲突的坑
前端
ze_juejin28 分钟前
ES6 Module 深入学习
前端
章丸丸31 分钟前
Tube - Studio Videos
前端·后端
因吹斯汀1 小时前
一饭封神:当AI厨神遇上你的冰箱,八大菜系大师在线battle!
前端·vue.js·ai编程
再学一点就睡1 小时前
NATAPP 内网穿透指南:让本地项目轻松 “走出去”
前端
拜无忧1 小时前
2025最新React项目架构指南:从零到一,为前端小白打造
前端·react.js·typescript
稻草人不怕疼1 小时前
记一次从“按钮点不动”到“窗口派发缺失”的排查过程
前端
irving同学462382 小时前
TypeORM 列装饰器完整总结
前端·后端·nestjs