认识一个新事物，一般是从三个方面：是什么？为什么？怎么做？，那么vue组件同样，今天从三个方面着手系统学习vue组件
一、vue组件是什么？
vue组件是可以复用的vue实例，封装自己的标签+样式+js。
在vue实例开发过程中，使用组件，通常会涉及到组件化，组件化乍一听不是很好理解，其实我们在开发中把它理解为是一种封装的思想就方便多了，就像我们在之前学习js基础或者高级时，遇到重复使用的一段代码，会把它封装成为一个函数，然后哪里用就在哪里调，节省了很多代码量。同理，vue组件化也可以这么理解——把页面上 `可重用的部分` 封装为 `组件`，从而方便项目的开发和维护📍
一个页面，可以拆分成一个个组件，一个组件就是一个整体，每个组件可以有自己独立的结构样式和行为（html+css+js），可以独立工作的小型视图。
举个例子：
如图所示：
左边的整个页面我们可以把它当成是一个大盒子，在这个盒子里我们给页面进行布局，可以分为不同的盒子，根据我们的布局，在程序编写过程中划分为不同的组件。
二、为什么使用vue组件？
从上述图片中，我们不难看出，每个组件上独立存在的，他们之间互不影响，从而可以发挥组件的最大效能——便于复用，不用担心变量重复、作用域等一系列问题，非常的方便
三、vue组件怎么使用？
在使用vue组件的时候我们可以先设立一个目标：
每个组件都是一个独立的个体，代码里体现为一个独立的.vue文件
那么使用vue组件，我们可以简单的分为4个部分：创建、导入、注册、使用
1、创建组件：
封装要复用的标签, 样式, JS代码（新建一个vue文件)
:
1.1:vue脚手架搭件企业级开发平台，生成对应的文件【用不到的文件可以删掉，避免干扰】，创建指令 vue create 文件名
1.2生成对应文件后，打开在src目录下创建一个专门存放组件的文件夹views，在views文件夹中创建组件test.vue 前面我们讲到过组件一共有html、css、js三部分组成
2、导入组件与注册组件
导入与注册两者是相互关联的，所以我们把他们两个放一起来看，注册和导入主要分为全局导入、注册和局部导入、注册，根据他们的关系，我们分两部分看全局与局部。
全局：
在main.js 文件中导入与注册
语法使用
导入：（import 组件对象 from 文件路径)
注册：Vue.component（“组件名”，组件对象）
上代码：
全局导入和注册多个组件时，可以写到一起，如：
局部：
在app.vue文件中导入与注册，【app是默认的名字，在实际开发中可以任意命名，如aa.vue，叫什么都可以，但是我们一定要分的清】
语法使用
导入：（import 组件对象 from 文件路径)
注册：
export default {
components:{
“组件名”：组件对象，
“组件名”：组件对象【多个时】，
···
}
}
在这里，一开始局部注册的语法相对于全局注册的复杂一些，之后我们再局部注册的时候，直接写在下方的大括号中，每组写完一定要用逗号隔开
上代码：
3、vue组件如何使用？
在我们刚开始接触vue组件时，我们先从最简单的使用开始
开发过程中，我们使用vue组件，都是把组件名当作（自定义）标签使用，这里他和html中p、div、a、h1等是一样的。组件最终运行的结果是：把组件标签最终替换成组件template（html）中的标签
好啦，以上就是我们vue组件的认识以及简单使用掌握这些之后我在下篇会给大家介绍vue组件使用时的一些规范，让我们看起来更像是一个合格的程序员。如果这些对你有帮助，记得点赞收藏哦
