您的位置:首页 > Web前端 > Vue.js

Vue父子组件生命周期

2018-06-07 12:06 211 查看

转载自:https://www.geek-share.com/detail/2727242247.html

vue父子组件钩子函数触发顺序

beforeMount后mounted前构造子组件 依次遍历

beforeCreate-父组件
create-父组件
beforeMount-父组件
beforeCreate-子组件
create-子组件
beforeMount-子组件
beforeCreate-次子组件
create-次子组件
beforeMount-次子组件
mounted-次子组件
mounted-子组件

mounted-父组件

钩子函数发生的事

beforeCreate-组件刚实例化完成 el 和 data 都为undefined 
created-组件实例化完成 data 数据有值,Dom还未生成 el没有值

beforeMount-虚拟Dom已生成 el 和 data 有值 此时显示<span>{{message}}</span>  俗称占坑

mounted-挂载完成 此时显示 <span>123 </span>

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: