Vue组件：创建、template模板、data、父子组件

1、创建

注册全局组件 ：

任意vue实例均可使用， 本质是个自定义标签对，组件可以重复调用；

Vue.component(arg1, arg2);

arg1: 组件名称，即自定义标签名，命名方式有三种： my-com, myCom, MyCom；

arg2: 是个对象，描述组件的相关信息；template: 模板内容，即组件内部的内容，也是自定义标签对中的内容；

          注意事项，只有一个根元素，类似于Html文档，或者一个迷你版本的html文档

调用方式：只有一种 , my-com

        Vue.component('my-com', {
            template: '
 
 这是标题 
'
        });

注册局部组件：

只有在当前vue实例范围内使用

        var vue = new Vue({
            el: '#demo',
            data: {},
            methods: {},
            computed: {},
            // 注册局部组件，只有在当前vue实例范围内使用
            components: {
                // 属性名对应arg1,   MyTab, myTab
                // 属性值对应arg2
                'my-com': {
                    template: '
 组件 
'
                }
            }
        });

2、template模板

3、data

vue实例： el, data, methods, computed, components 等

vue组件： template(el), data, methods, computed, components等

vue实例，被称为根实例，也被称为根组件

组件是迷你版本的实例

凡是vue实例具备的属性，vue组件几乎都有

组件之间的作用域是独立，隔离的。默认情况下，组件之间的数据或方法是不共享的，除非组件之间互相通信

组件的模板内容，组件本质是自定义标签对。 标签对内部是具有原始内容(初始内容)，默认情况下，模板内容，会完全替代原始内容；

vue实例的内容范围 

vue组件的内容范围 template : '#com' 所在的范围

    
    
        
 可以写内容 
    

4、父子组件

 父子组件：在组件A的模板内容中，调用组件B，组件A被称为父组件，组件B是子组件；

vue实例： 根组件