自定義vue全局組件use使用

自定義一個全局Loading組件，並使用：
總結目錄：
|-components
　　|-loading
　　　　|-index.js 導出組件，並且install
　　　　|-loading.vue 定義Loading組件

1.components/loading/index.js

import LoadingComponent from "./Loading.vue"
const Loading = {
    install: function(Vue){
        Vue.component("Loading", LoadingComponent)
    }
}
export default Loading

　　

2.components/loading/Loading.vue

<template>
    <div class="loading-box">
        loading...
    </div>
</template>

　　

3.main.js

import Vue from 'vue'
import App from './App'
import Loading from "./components/loading/index.js"

Vue.use(Loading)

new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

　　

4.App.vue

<template>
    <div id="app">
        <Loading></Loading>
    </div>
</template>