3-2Vue实例生命周期函数 · 武功秘籍大全

~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>3-2Vue实例生命周期函数</title> <script src="vue.js"></script> </head> <body> <div id="app"> </div> <script> // 生命周期函数就是Vue实例在某一个时间点会自动执行的函数 var vm = new Vue({ el: '#app', data:{ test:'hello world' }, template: '<div> {{test}}</div>', beforeCreate() { console.log('beforeCreate') }, created() { console.log('created') }, beforeMount(){ console.log(this.$el) console.log('beforeMount') }, mounted(){ console.log(this.$el) console.log('mounted') }, beforeDestroy(){ // 执行了destroy()时执行,vm.$destroy() console.log('beforDestroy') }, destroyed(){ // 执行了destroy()时执行,vm.$destroy() console.log('destroyed') }, beforeUpdate(){ console.log('beforeUpdate') }, updated(){ console.log('updated') } }) </script> </body> </html> ~~~