先简单看一下项目的目录：
vue项目目录.png
然后在src/components目录下新建一个存放全局的文件夹：这里为loading，然后新建一个loading.vue和index.js。（src下应该也是可以的，在main.js下引用时候写对相对路径就可以了，今天由于时间问题就不做验证了，有时间了会写一个来这里给个准确答复）
loading.vue和一般组件里写的是一样的，这里代码如下：
<template>
<div>
公用组件
</div>
</template>
<script>
export default {
}
</script>
<style scoped>
div{
font-size:40px;
color:#f60;
text-align:center;
}
</style>
index.js才是关键所在，代码如下：
import loadingComponent from './loading.vue'
const loading={
install:function(Vue){
Vue.component('Loading',loadingComponent)
} //'Loading'这就是后面可以使用的组件的名字，install是默认的一个方法
};
export default loading;
这里需要说明一下：
当我们使用Vue.use()引人全局组件vue-resource进行数据请求和后端进行数据交互时，以及全局组件vue-router时，自动调用的就是install，而install返回的必须是一个组件。这里有时间了做详细介绍
然后在main.js中引入组件，并用Vue.use()引入这个全局组件：
//引入自定义全局组件
import loading from './components/loading'
Vue.use(loading)
这样，一个全局组件就定义完成了，可以在下面各个组件用放心引用即可，如这里在首页引用：
<template>
<div id="day">
<h1>我是首页</h1>
<Loading></Loading>
</div>
</template>
最后，在简单提一下vue-resource和axios：
两者都用来请求数据，然而前者现在已经不再更新，vue的作者也推荐使用axios。所以我们使用axios用来请求数据就可以了~
最后，关于周末有时间了会详细了解。
- 以上内容大多摘自网上他人总结，这里仅用于自己复习和掌握。
