专栏首页coding了解vue.js的生命周期函数四个生命周期函数两个运行中的事件

了解vue.js的生命周期函数四个生命周期函数两个运行中的事件

了解vue的生命周期函数和运行中事件,有助于我们更好地使用vue

具体代码文件

生命周期

四个生命周期函数

  • beforeCreate

第一个生命周期函数,表示实例已经创建,但 data 和 methods 还没有被初始化

  • created

第二个生命周期函数,能够获取data中的数据和methods中的方法

  • beforeMount

第三个生命周期函数,模板已经在内存中编译完成,但尚未渲染到页面中'

  • mounted

第四个生命周期函数, 内存中的模板已经渲染到页面,用户可以看到渲染好的页面

vue的生命周期函数

两个运行中的事件

可以监听数据的变动

运行中的事件.gif

  • beforeUpdate

data中的数据已经是最新的,而页面中显示的数据还是旧的,两者尚未同步

  • updated

此时,data中的数据与页面中的数据已经同步更新

如想了解更多的vue实例,请查阅我的vue笔记目录

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • hexo搭建个人博客

    搭建个人博客有很多种方式,最老牌的当属wordpress,功能丰富,但过于笨重。我想要的只是最简单的显示文章以及搜索功能,当然,样式要简洁漂亮,而且必须支持ma...

    章鱼喵
  • vue 使用 cli 工具构建项目

    章鱼喵
  • Linux笔记5.展开与引用

    章鱼喵
  • 三年前端程序员应对阿里电话面试,过程心惊胆战!

    看到这条消息,说真的,心里真的很高兴,老鸡冻的,但潜意识告诉我,我现在能力肯定过不了,于是自己就怂了,回了我不行之类的话,然而,HR叫我试试,于是我想到心理上一...

    一墨编程学习
  • 1.创建项目

    然后除了Use EsLint……选择no(代码检查功能,如果选择了默认回车,少打个空格都会报错),其他的询问都直接敲回车。

    玩蛇的胖纸
  • 这场NeurIPS 2019研讨会,让新人与Bengio等大佬面对面交流,还颁发了三项论文奖

    NeurIPS 2019 已经在温哥华接近尾声。作为人工智能和机器学习领域最顶级的盛会之一,本届大会参会总人数已经超过 13000 人,比去年增加了 50%。

    机器之心
  • [图解DS基础概念]Critical value,Alpha,Z-score,P-value 关系

    参考 ? ---- critical value 临界值 +-1.96 叫 critical value 临界值,是拒绝域的边界: 例如某个实验中计算出 z s...

    杨熹
  • 最终一致性其实比MVCC简单

    关于NoSQL有这样一个误解: NoSQL最大的谎言是其简单,其实不是,简单意味着开发人员和运营人员需要做很多难且复杂的事情,它们最终得重复实现数据库已经实现的...

    物流IT圈
  • @RequestMapping 用法详解之地址映射

    前段时间项目中用到了RESTful模式来开发程序,但是当用POST、PUT模式提交数据时,发现服务器端接受不到提交的数据(服务器端参数绑定没有加任何注解),查看...

    Java编程指南
  • poiAndEasyExcel学习(五)

    崔笑颜

扫码关注云+社区

领取腾讯云代金券