zoukankan      html  css  js  c++  java
  • 详解vue生命周期及每个阶段适合进行的操作

    VUE生命周期的四个阶段

    • create 创建 -------- 创建vue实例并初始化
    • mount 挂载 -------- 把vue实例和视图进行关联
    • update 更新 ------- 监听数据与视图的变化
    • destroy销毁 ------- 销毁实例

    生命周期 --- 钩子函数

    vue为上面的4个大的阶段提供了一个可编程的接口,我们可以在这4个的某个时段写入一些自己的逻辑,vue是通过配置一个叫做生命周期钩子函数的选项来实现的

    beforecreate

    • 在实例初始化之后,数据观测(data observer)和event/watcher事件配置之前调用,里面的this指向实例

    create

    • 实例已经创建完成之后被调用。在这一步,实例已完成以下的配置;数据观测(data observer),属性和方法的运算,watch/event事件回调。然而,挂载阶段还没开始,还未与页面关联起来,$el属性目前不可见。可在这阶段进行一些初始化的操作(如ajax获取数据之类的)

    beforemount

    • 在挂载之前没调用,解析模板,把实例对象下的$el属性指向设置中的el参数指定的元素,这个解析后的模板还没有和$el进行绑定

    mounted

    • 挂载之后调用,把解析后的模板与页面元素进行绑定,用解析后的模板内容替换页面

    beforeupdate

    • 在数据绑定之前被调用

    update

    • 在数据改变之后被调用,可以进行依赖于dom的操作(可以在这个阶段进行dom操作)
  • 相关阅读:
    移动端摇一摇与重力感应事件
    百度的js日历
    wow.js
    pc网页中嵌入百度地图
    微信小程序之倒计时插件 wxTimer
    IE常见的兼容处理
    particles.js使用及配置
    微信小程序之swiper组件高度自适应
    js获取元素的滚动高度,和距离顶部的高度
    vue实现移动端触屏拖拽功能
  • 原文地址:https://www.cnblogs.com/Ivy-s/p/7496462.html
Copyright © 2011-2022 走看看