热门文章
本篇文章为大家展示了Vue的生命周期有哪些，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。
具体如下：
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Vue的生命周期</title><scripttype="text/javascript"src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script></head><body><h2>Vue的生命周期</h2><hr><pid="app">{{count}}<p><button@click="add">Add</button></p></p><buttonοnclick="app.$destroy()">销毁</button></body></html><script>varapp=newVue({el:'#app',data:{count:1},methods:{add:function(){this.count++}},//有这么多钩子函数一共十个//初始化之后beforeCreate:function(){console.log('1-beforeCreate初始化之后');},//创建完成created:function(){console.log('2-created创建完成');},//挂载之前beforeMount:function(){console.log('3-beforeMount挂载之前');},//被创建mounted:function(){console.log('4-mounted被创建');},//数据更新前beforeUpdate:function(){console.log('5-beforeUpdate数据更新前');},//被更新后updated:function(){console.log('6-updated被更新后');},//activated:function(){console.log('7-activated');},//deactivated:function(){console.log('8-deactivated');},//销毁之前beforeDestroy:function(){console.log('9-beforeDestroy销毁之前');},//销毁之后destroyed:function(){console.log('10-destroyed销毁之后')}})</script>运行结果：
上述内容就是Vue的生命周期有哪些，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注亿速云行业资讯频道。