VUE的普通组件的注册

组件的注册有两种方式

1.局部注册

   只能在注册的组件中使用（一般用于该组件只有个别地方使用的）

 （1）先创建组件的.vue文件

<template>
  <div class="header">header</div>
</template>

<script>
export default {

}
</script>

<style>
.header{
    height: 100px;
    line-height: 100px;
    background-color: #fff;
    font-size: 30px;
}
</style>

 （2）在使用的组件中导入并注册该组件

<script>
//导入组件(注意组件名称用大驼峰的写法）
import Header from /component/Header.vue
export default {
//注册组件
  components:{
 //组件名称:组件对象
   Header:Header,
//(如果组件名称和组件对象一致可以省略写成)
   Header
  }
}
</script>

 （3）使用组件：

<template>
  <div id="app">
    <!--使用组件名的标签对，就能使用该组件-->
    <Header></Header>
  </div>
</template>

<script>
import { component } from 'vue/types/umd'
import Header from './components/Header.vue'
//导入组件(注意组件名称用大驼峰的写法）
import Header from /component/Header.vue
export default {
  name: 'App',
//注册组件
  components:{
   Header:Header
    Header
  }
}
</script>

2.全局注册

    所有组件都可以使用该组件（一般通用的组件都会用全局注册）

 （1）先创建组件的.vue文件   （与局部注册的步骤一样这里再重复）

 （2）在main.js中进行全局注册

//导入组件 组件.vue后缀可以省略
import Header from /components/Header

//全局注册组件
Vue.component('Header',Header)

（3）全局注册之后可以在任意地方使用该组件，使用方式也是用组件的标签对如<Header></Header>