Vue全局添加组件

一. 背景

在项目中有时需要反复用到如区域选择器等组件,每次使用时都需要在对应的vue中添加import,并在component中注册,为了避免多次书写引用代码,可以自定义全局组件,只需要在main.js中一次性注册在vue项目中,可以自定义组件像vue-resource一样使用Vue.use()方法来使用。

二. 具体实现方法

1、首先建一个自定义组件的文件夹,比如叫loading,在该文件夹下新建一个index.js,一个自定义组件loading.vue,在这个loading.vue里面就是这个组件的具体的内容,

2、在index.js中,规定使用这个组件的名字,以及使用方法,如:

import loadingComponent from './loading.vue'
	    const loading={
	        install:function(Vue){
	            Vue.component('Loading',loadingComponent)
	        }  //'Loading'这就是后面可以使用的组件的名字,install是默认的一个方法
	    };
	    export default loading;

3、只要在main.js中规定了install方法,就可以像一些公共的插件一样使用Vue.use()来使用,如:

    import loading from './loading'
    Vue.use(loading)

原文:https://blog.csdn.net/generon/article/details/72848104

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值