components 组件

组件之间的关系

组件在被封装好之后，彼此之间是相互独立的，不存在父子关系

在使用组件的时候，根据彼此的嵌套关系，形成了父子关系、兄弟关系

组件的基本使用

1. import

步骤1：使用 import 语法导入需要的组件

import Left from '@/compontents/Left.vue'

2. components

步骤2：使用 components 节点注册组件

export default {
  components: {
    Left
  }
}

3. 使用

<div class="box">
  <left></left>
</div>

全局组件

通过 components 注册的是私有子组件

如果需要全局使用 需要在 vue 项目的 main.js 入口文件中，通过 Vue.component() 方法，可以注册全局组件。

// 导入需要全局注册的组件
import Count from '@/compontents/Count.vue'

// 参数1：字符串格式，表示组件的“注册名称”
// 参数2：需要被全局注册的组件
Vue.component('MyCount', Count)