Vue2.x生命周期

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Cc_Rain0624/article/details/83621981
<script type="text/ecmascript-6">
export default {
    name: 'Header',
    props:{
        Title:{
            type:String
        }
    },
    data() {
        return {}
    },
    methods:{
        updateTitle:function(){
            //    this.Title="我已经被Footer的点击事件修改了!";
            this.$emit("UpdateFatherTitle","我的内容来自子组件!");
        }
    },
    beforeCreate() {
        // 对象没有创建前 此时只是对事件做了配置
        // 可以做加载的动画
        // alert("组件实例化之前执行的函数");
    },
    created() {
        // 组件已经实例化好了 DOM还未生成
        // 可以获取对应的获取一些数据 赋给属性 可以结束loading加载
        // alert("组件实例化完毕,但页面还未显示");
    },
    beforeMount() {
        // 编译当前模板 是在虚拟DOM中
        // alert("组件挂载前 页面仍未展示 但虚拟DOM已经配置完");
    },
    mounted() {
        // 将el 指定的dom元素 挂载渲染
        // 从后台获取数据 在该方法里填写
        // alert("此方法执行后 页面显示!");
    },
    beforeUpdate() {
        // 组件更新之前
        // alert("组件更新前,页面仍未更新");
    },
    updated() {
        //组件更新后 页面就展示了
        // alert("组件更新后 此方法自行后 页面显示");
    },
    beforeDestroy() {
        // alert("组件销毁前");
    },
    destroyed() {
        // ALERT("组件销毁");
    },

    components: {}
}
</script>

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/Cc_Rain0624/article/details/83621981