VUE的生命周期

最新推荐文章于 2023-08-29 15:21:31 发布

浪豪

最新推荐文章于 2023-08-29 15:21:31 发布

阅读量166

点赞数

分类专栏：前端文章标签：前端

本文链接：https://blog.youkuaiyun.com/Chinachenh/article/details/115322555

版权

前端专栏收录该内容

12 篇文章

订阅专栏

本文深入探讨Vue.js组件的生命周期，从创建、挂载、更新到销毁的各个阶段，包括beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy和destroyed等关键钩子函数。通过示例展示如何在不同阶段执行操作，理解这些阶段对于优化Vue应用至关重要。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

看成一个自执行函数

分为几个阶段：创建阶段->挂载阶段->更新阶段->销毁阶段

创建阶段：创建前（beforeCreat）-> 更新后（created）
挂载阶段：挂载前（beforeMount）->挂载后（mounted）
更新阶段：更新前（beforeUpdate）->更新后（update）
销毁阶段：销毁前（beforeDistory）->销毁后（distory

示例：

new Vue({
    el:"#app",
    data:{
        msg:'hello'
    },//存储数据
    methods:{
        update(){
            this.msg="你好"
        }
    },//存储方法
    computed:{},//计算方法
    filters:{},//过滤方法
    beforeCreate(){
        console.log("这是创建前")
    },
    created(){
        console.log("这是创建之后")
    },
    beforeMount(){
        console.log("这是挂载前")
    },
    mounted(){
        console.log("这是挂载后")
    },
    befor
})