vue extend 的基本使用

1.组件构造器（extend）

vue.extend创建的是一个组件构造器，不是直接过载在vue的示例对象，
可以理解为构造了一个和vue组件内部有一样结构的对象，因此需要在vue上进行注册才能使用
最终还是要通过Vue.components注册才可以使用的。 

代码示例
const Loading = Vue.extend({
    template: ``,
    data () {
        return {
            hello: ''
        }
    }
})

// 注册局部组件
Vue.component('loading', Loading)

2.Vue $mount的用法

$mount的方法把扩展挂载到dom上
代码示例
var judy = Vue.extend({
           template:'<p>{{message}}</p>',
            data: function () {
                return{
                    message:'I am Judy'
                }
            }
 
        });
        var vm = new judy().$mount('#app')

3.上边说到dom挂载，下边顺便说几种dom挂载的方法

以上边judy 为例
new judy ().$mount('#app') --示例方法1$mount
new judy({ el: '#app' }) --方法二
// 或者，在文档之外渲染并且随后挂载--方法三
var component = new judy().$mount()
document.getElementById('app').appendChild(component.$el)

4.构造器的生命周期

构造器的生命周期包括：created mounted updated destroyed 
实例创建完成之后状态为created 
挂载实例到dom上后状态为mounted 
dom的数据更新完成之后为updated 
销毁实例（执行vm.$destroy()）后为destroyed