Vue的生命周期

佚名 6年前 (2019-04-13) 随笔 452人围观抢沙发百度已收录

生命周期函数就是Vue实例在某一时间点会自动执行的函数

//当创建Vue实例的时候，Vue进行基础创建之后自动调用 beforeCreate
                beforeCreate: function(){
                    console.log("beforeCreate")
                },
                //当调用beforeCreate之后，会进行外部绑定和注入，
                //就会执行created
                created:function(){
                    console.log("created")
                },
                //Vue的初始化基本结束了，然后询问这个Vue实例是否有 el 属性，
                //然后询问有没有template这个属性，没有就把el属性的id里对应的HTML元素的内容当做模板进行渲染，也就是我们现在写的这个
                //在页面渲染之前，beforeMount
                beforeMount:function(){
                 
                    console.log("beforeMount:数据被挂载",this.$el)
                },
                //执行beforeMount后，数据会被挂载到页面上
                //渲染之后，会执行函数 mounted
                mounted:function(){
         
                    console.log("mounted：数据被渲染",this.$el)
                },
                //当执行完mounted，数据被渲染到页面上
                
                
                
                
                
                //当数据发生改变，还没有渲染之前
                beforeUpdate:function(){
                    console.log("beforeUpdate")
                },
                //当数据重新渲染之后，会执行update
                updated:function(){
                    console.log("updated")
                },
                    
                
                //当调用 app.$destroyed()，先调用beforeDestroy，在调用destroyed，最后undefined销毁
                beforeDestroy:function(){
                    console.log("beforeDestroy")
                },
                destroyed:function(){
                    
                    console.log("destroyed")
                }

SRE实战互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。