这几个月用vue框架新做了一个项目,也算是边学习边实践吧。学习中也看过一些别人的开源项目,起初对mounted和created有一些疑惑,查询相关资料发现,这和vue的生命周期有关,在此也就做一个总结。
每个 Vue 实例在被创建时都要经过一系列的初始化过程——如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不同阶段添加自己的代码的机会。
下图是实例的生命周期,在生命周期的各个阶段都会有相应的钩子函数。从图中可以看出,created运行时,还未挂载到DOM,不能访问到$el属性,可用于初始化一些数据,但和DOM操作相关的不能在created中执行;monuted运行时,实例已经挂在到DOM,此时可以通过DOM API获取到DOM节点。
有几篇相关文章写的不错,也做一下推荐 https://www.jianshu.com/p/f99d3e3d2256
https://segmentfault.com/a/1190000014705819