vue components using the install function to facilitate the global call to make plug-ins

In vue project, we can custom components, such as the use of the same element-ui Vue.use () method is used, the specific method:

1. First create a new file Cmponent.vue

// Cmponent.vue
<template>
    <div>
        我是组件
    </div>
</template>
 
<script>
    export default {
 
    }
</script>
 
<style scoped>
    div{
        font-size:40px;
        color:#fbb;
        text-align:center;
    }
</style>

2. Second, build index.js file in the same directory to register the component uses the global install method in this document

Component from Import './Cmponent.vue' 
const Component = { 
    the install: function (Vue) { 
        Vue.component ( 'Component-name' , Component) 
    }   // 'Component-name' is the name of the component that can be used later , install a default method 
    
} 
// derive the component 
export default component

3. Use

// As long as the provisions of the install method index.js where, as you can use Vue.use to other ui component library () to globally use

// As long as the predetermined index.js install method, the above can be used to Vue.use other library components ui () to be used globally 
Import loading from './index.js' 
 
Vue.use (loading)
 
 <Template> 
   <div> 
      <Component-name> </ Component-name> 
   </ div>     
</ Template>