Vue生命周期 相关

vue 的生命周期函数想必大家都很熟悉，下面总结下

beforeCreate() {
        // vue实例创建，但是这里的data 并未初始化
        // this 已经被创建， this.a  undefined
    },
    created() {
        // 这里的data 已初始化，
    },
    beforeMount() {
        // 这里 虚拟dom已经创建完毕，但是没有挂载
        // this.$el undefined
    },
    mounted() {
        // 挂载结束，可以获取this.$el
    },
    beforeUpdate() {
        // 这里双向绑定的data 已经改变 但是dom没有更新
    },
    updated() {
        // dom更新完毕
    },
    beforeDestroy() {
        //实例销毁之前调用,实例依然是可以使用的
    },
    destroy() {
        // 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。
    },

从页面A 到 页面B 时，AB的生命周期函数触发顺序

1. B- beforeCreate
2. B- created
3. B- beforeMount
4. A- beforeDestroy
5. A-Child- beforeDestroy
6. A-Child- destroyed
7. A- destroyed
8. B- mounted

当页面A改变属性，触发子组件更新时，子父组件生命周期函数触发顺序

1. A- beforeUpdate
2. A-Child- beforeUpdate
3. A-Child- updated
4. A- updated