vue全局注册组件

Vue是一个组件化开发的框架，一般我们在项目中使用自定义的组件的注册步骤是这样的。

1.创建一个组件：
比方说我们现在新建一个demo.vue文件，随便写一行代码。

<template>
    <div>
        {{msg}}
    </div>    
</template>
<script>
export default {
    data() {
        return {
            msg:'loading......'
        }
    }
}
</script>

2.在组件的同级目录下，再创建一个idnex.js文件(名字可以随便起)

import LoadingComponents from './loading.vue';

const loading = {
    install:function(Vue) {
        Vue.component('Loading', LoadingComponents)
    }
}

export default loading;

3.①在需要使用的页面引入自定义组件，并使用

import Vue from 'vue'
import App from './App.vue'
import loading from './components/loading/'

Vue.use(loading);

new Vue({
  el: '#app',
  data:{
    eventHub: new Vue()
  },
  render: h => h(App)
})

3.②或者在全局注册自定义组件

import loading from "./components/index.js";  // 这里是js文件，就是自定义组件对应的index.js文件
	Vue.component(loading);
	

现在就可以在任何地方，直接使用自定义的组件啦。。。。。