10vue组件入门_如何写一个最简单的vue组件_vue组件的作用是啥

一、vue组件的概念：

       组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义标签，所有的 Vue 组件同时也都是 Vue 的实例（对象）。

commonJS，AMD，CMD是把JS逻辑进行模块化

vue组件是把页面（html代码，CSS代码）进行模块化

如下图所示，一个页面分四个部分，每个部分是个vue组件，而页面成了vue组件的容器。

 

二、  使用组件

       vue.js中创建组件有三个步骤：创建组件构造器，注册组件以及使用组件

1、 定义组件(创建组件构造器)（三种）

2、 注册（声明）组件（两种）

3、 使用组件

示例：

代码示意图：

源代码：