'Vue的生命周期'

发表于

生命周期

  • vue在组件的每个环节都提供了钩子函数(回调)

    当调用vm.$mount()挂载后执行挂载数据
    当调用vm.$destroy()后执行删除实例

    图示

    vue声明周期图解

    8个状态

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    let vm =new Vue({
        el:'#app',
        data:{
            msg:data
        },
        beforeCreate(){
            alert('开始创建前触发')
        },
        created(){
            "use strict";
            alert('创建完成时触发')
        },
        beforeMount(){
            "use strict";
            alert('挂载之前')
        },
        mounted(){
            "use strict";
            alert('挂载完成后')
        },
        beforeUpdate(){
            "use strict";
            alert('更新之前')
        },
        updated(){
            "use strict";
            alert('更新完成')
        },
        beforeDestroy(){
            "use strict";
            alert('销毁之前')
        },
        destroy(){
            "use strict";
            alert('销毁完成')
        }
    });