前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue --- 生命周期

vue --- 生命周期

作者头像
小蔚
发布2019-09-11 15:42:12
3750
发布2019-09-11 15:42:12
举报
文章被收录于专栏:小蔚记录

create 和 mounted 相关

咱们在chrome浏览器里打开,F12console就能发现

代码语言:javascript
复制
beforecreated:el 和 data 并未初始化 
created:完成了 data 数据的初始化,el没有
beforeMount:完成了 el 和 data 初始化 
mounted :完成挂载

另外在标红处,我们能发现 el 还是 {{message}},这里就是应用的 Virtual DOM(虚拟Dom)技术,先把坑占住了。到后面mounted挂载的时候再把值渲染进去。

update 相关

这里我们在 chrome console里执行以下命令

代码语言:javascript
复制
app.message= 'yes !! I do';

下面就能看到data里的值被修改后,将会触发update的操作。

destroy 相关

有关于销毁,暂时还不是很清楚。我们在console里执行下命令对 vue实例进行销毁。销毁完成后,我们再重新改变message的值,vue不再对此动作进行响应了。但是原先生成的dom元素还存在,可以这么理解,执行了destroy操作,后续就不再受vue控制了。

当然,还有更多,继续探索中......

写在最后

本文是一个vue的生命周期的理解,如有错误还请大牛指正,让小子也有得进步。 如果对你有所帮助,那是我最大的荣幸。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-03-06 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • create 和 mounted 相关
  • update 相关
    • destroy 相关
    • 写在最后
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档