vue传值生命周期

1、父子组件传值生命周期
父—beforeCreate
父—created
父—beforeMount
子—beforeCreate
子—created
子—beforeMount
子—mounted
父—mounted
2、页面路由跳转传值生命周期
A页面----B页面
一般在A页面的beforeDestroy里面传值；在B页面created里面接收
B----beforeCreate
B—created
B—beforeMount
A—beforeDestroy
A—destroyed
B—mounted
3、父子组件传递异步数据
在父组件的mounted里面请求数据；传递给子组件；子组件刚开始会接收到空值，可能会报错；这样我们需要在调用子组件的时候在上面加个判断；当异步数据执行完成后在进行渲染

<div>这是父组件</div>
<Children :arr="myArr  v-if="flag"></Children>

flag:false

mounted(){
setTimeout(()=>{this.myArr={"data":[1,2,3]};this.flag=true;})
}


<div>这是子组件:{{myArr.data[1]}}</div>

props:["myArr"]
created(){console.log(this.myArr)}

总结：
初始化：
1.new Vue()初始化vue实例
2.初始化内部的一些事件，生命周期开始
3.初始化vue内部的数据，把data中的所有的数据劫持给vm；
4.判断是否有el 指定el参数 –vm.$mount('#app') 挂载
5.确定是否有模板（template），没有，则el就是模板
6.动态渲染数据模板 把el替代
数据更新：
1.数据发生改变
2.vue根据diff算法 视图自动更新数据发生变化的部分
销毁
1.调用vm.$destroy()方法
2.卸载vue内部的一些事件和监听等；vue数据发生变化，页面不再更新

生命周期选项
1.beforeCreate：在组件实例初始化完成之后立即调用。会在实例初始化完成、props 解析之后、data() 和 computed 等选项处理之前立即调用。注意，组合式 API 中的 setup() 钩子会在所有选项式 API 钩子之前调用，beforeCreate() 也不例外。
2.created：在组件实例处理完所有与状态相关的选项后调用。
当这个钩子被调用时，以下内容已经设置完成：响应式数据、计算属性、方法和侦听器。然而，此时挂载阶段还未开始，因此 $el 属性仍不可用。
3.beforeMount：在组件被挂载之前调用。当这个钩子被调用时，组件已经完成了其响应式状态的设置，但还没有创建 DOM 节点。它即将首次执行 DOM 渲染过程。这个钩子在服务端渲染时不会被调用
4.mounted：在组件被挂载之后调用。组件在以下情况下被视为已挂载：所有同步子组件都已经被挂载。(不包含异步组件或 树内的组件)
其自身的 DOM 树已经创建完成并插入了父容器中。注意仅当根容器在文档中时，才可以保证组件 DOM 树也在文档中。
这个钩子通常用于执行需要访问组件所渲染的 DOM 树相关的副作用，或是在服务端渲染应用中用于确保 DOM 相关代码仅在客户端被调用。
这个钩子在服务端渲染时不会被调用。
5.beforeUpdate：在组件即将因为一个响应式状态变更而更新其 DOM 树之前调用。
6.updated：在组件因为一个响应式状态变更而更新其 DOM 树之后调用。