[07] 组件注册

Vue.js 组件

组件（Component）是 Vue.js 最强大的功能之一。

组件可以扩展 HTML 元素，封装可重用的代码。

组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树。

局部注册

• 特点：只能在注册的组件内使用

• 步骤：

  1. 创建.vue文件（三个组成部分）
  2. 在使用的组件内先导入再注册，最后使用

• 使用方式：当成html标签使用即可 <组件名></组件名>

• 使用大驼峰命名法， 如 HmHeader

5.语法

// 导入需要注册的组件
import 组件对象 from '.vue文件路径'
import HmHeader from './components/HmHeader'

export default {     // 局部注册
  components: {
   '组件名': 组件对象,
    HmHeader:HmHeaer,
    HmHeader
  }
}

全局注册

• 特点：全局注册的组件，在项目的任何组件中都能使用

• 步骤

  1. 创建.vue组件（三个组成部分）
  2. main.js中进行全局注册

• 使用方式：当成HTML标签直接使用

<组件名></组件名>

• 大驼峰命名法， 如 HmHeader

• 语法

Vue.component('组件名', 组件对象)

Vue.component(tagName, options)
tagName 为组件名，options 为配置选项。注册后，使用以下方式来调用组件：
<tagName></tagName>