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;
相关推荐
herogus丶9 分钟前
【Chrome】‘Good助手‘ 扩展程序使用介绍
前端·chrome
独立开阀者_FwtCoder13 分钟前
面试官:为什么在 Vue3 中 ref 变量要用 .value?
前端·javascript·vue.js
NetX行者15 分钟前
基于Vue 3的AI前端框架汇总及工具对比表
前端·vue.js·人工智能·前端框架·开源
独立开阀者_FwtCoder16 分钟前
手握两大前端框架,Vercel 再出手拿下 Nuxt.js,对前端有什么影响?
前端·javascript·vue.js
独立开阀者_FwtCoder16 分钟前
弃用 html2canvas!快 93 倍的截图神器!
前端·javascript·vue.js
weixin_3993806931 分钟前
TongWeb8.0.9.0.3部署后端应用,前端访问后端报405(by sy+lqw)
前端
rui锐rui1 小时前
商品销售数据分析实验
vue.js·数据挖掘·数据分析
伍哥的传说1 小时前
H3初识——入门介绍之常用中间件
前端·javascript·react.js·中间件·前端框架·node.js·ecmascript
AA-代码批发V哥1 小时前
JavaScript之数组方法详解
javascript