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;
相关推荐
不想上班只想要钱14 分钟前
vue3+vite创建的项目,运行后没有 Network地址
前端·javascript·vue.js
流***陌32 分钟前
手办盲盒抽赏小程序前端功能设计:兼顾收藏需求与抽赏乐趣
前端·小程序
岁月宁静1 小时前
在富文本编辑器中封装实用的 AI 写作助手功能
前端·vue.js·人工智能
金士顿1 小时前
为什么MainWindow.xaml绑定的datacontext,EtherCATSuiteCtrl.xaml直接用了?
前端
533_1 小时前
[css] flex布局中的英文字母不换行问题
前端·css
浮游本尊1 小时前
React 18.x 学习计划 - 第四天:React Hooks深入
前端·学习·react.js
future_studio2 小时前
聊聊 Unity(小白专享、C# 小程序 之 日历、小闹钟)
前端·html
Yeats_Liao2 小时前
Go Web 编程快速入门 · 04 - 请求对象 Request:头、体与查询参数
前端·golang·iphone
祈祷苍天赐我java之术2 小时前
Redis 数据类型与使用场景
java·开发语言·前端·redis·分布式·spring·bootstrap
草莓熊Lotso3 小时前
C++ 方向 Web 自动化测试入门指南:从概念到 Selenium 实战
前端·c++·python·selenium