美文网首页
vue生命周期-mounted和created的区别

vue生命周期-mounted和created的区别

作者: 奔跑的兔子_ | 来源:发表于2018-05-02 11:48 被阅读0次

    https://blog.csdn.net/xdnloveme/article/details/78035065

    总结:

    beforeCreate 创建之前:已经完成了 初始化事件和生命周期
    created 创建完成:已经完成了 初始化注册和响应
    beforeMount 挂载之前:已经完成了模板渲染
    mounted :挂载之后:已完成HTML虚拟化,创建了el节点 可以操作DOM了
    beforeDestroy :摧毁之前:整个vue都处在实时监控空渲染和更新
    destroyed: 已摧毁,已经摧毁了观察者,子元素和事件监听

    created:在模板渲染成html前调用,即通常初始化某些属性值,然后再渲染成视图。
    mounted:在模板渲染成html后调用,通常是初始化页面完成后,再对html的dom节点进行一些需要的操作。

    挂载到节点上的初始化方法通常用mounted去操作,主动调起的用methods里面封装方法。

    数据初始化一般放到created里面,这样可以及早发请求获取数据,如果有依赖dom必须存在的情况,就放到mounted(){this.$nextTick(() => { /* code */ })}里面

    Vue是异步执行dom更新的,一旦观察到数据变化,Vue就会开启一个队列,然后把在同一个事件循环 (event loop) 当中观察到数据变化的 watcher 推送进这个队列。如果这个watcher被触发多次,只会被推送到队列一次。这种缓冲行为可以有效的去掉重复数据造成的不必要的计算和DOm操作。而在下一个事件循环时,Vue会清空队列,并进行必要的DOM更新。

    相关文章

      网友评论

          本文标题:vue生命周期-mounted和created的区别

          本文链接:https://www.haomeiwen.com/subject/zmoqrftx.html