zoukankan      html  css  js  c++  java
  • vue的生命周期函数

    *  越多说明越重要
    beforeCreate:
      当前生命周期函数主要用来做初始化工作,在这个生命周期函数中我们可以创建一个loading

    created:(*****)
      创建后:
        1、在当前生命周期函数中我们可以访问到vm身上所有的属性和方法
        2、当前生命周期函数会将data和methods身上所有的属性和方法都挂载在vm的实例身上
        3、当前生命周期函数会将data身上所有的属性添加一个getter/setter方法,因此如果需要进行
          前后端数据交互的时候必须在当前生命周期中进行(响应式原理),如果数据没有提前在data中进行了绑定
          那么这个属性身上就不会有getter/setter方法,因此数据也不会动态的进行改变

    beforeMount:
      挂载前:
        数据和模板还没有进行相结合,在这个生命周期函数中我们可以进行数据最后的修改

        在当前生命周期函数中是访问不到真实的DOM结构

    mounted:(*****)
      挂载后:
        数据和模板已经结合,在这个生命周期函数中我们可以通过this.$refs访问到真实DOM结构

        $refs
          ref="值必须是整个VDom中唯一";    访问的时候通过this.$refs.值


          ref与document的区别?
            document是从整个页面去查找DOM结构,这个DOM结构肯定是已经插入到页面的DOM结构
            ref是从当前vm的虚拟DOM中找到的当前元素,ref是从内存当中找到的DOM结构


    beforeUpdate:
       更新前:
        当data中的数据发生了改变的时候就会执行
        1、可以访问到真实的DOM结构
        2、可以对数据做最后的修改
        3、当前生命周期函数中的数据和模板还没有更新完毕

    updated:
      更新后:
        1、数据更新后最新的DOM结构
        2、在当前生命周期函数中需要特别的注意,因为当前函数是一个频繁触发的函数。
        因此如果在当前生命周期函数中做一些事件绑定或者实例化的时候需要做一个提前判断

    beforeDestroy:*
      销毁前
        1、在这个生命周期函数中,还是可以继续访问到真实的DOM结构以及data中的数据
        2、一般我们都会在这个生命周期函数中做一些事件解绑/移除的操作

    destroyted:
      销毁后:
        1、将DOM与数据之间的关联进行断开
        2、在当前生命周期函数中是访问不到真实的DOM结构


    activated

      活跃状态
        如果当前页面是一个显示的状态,那么activated这个生命周期就会被触发

    deactivated

      缓存状态
        如果当前页面是一个非显示状态,那么deactivated这个生命周期就会被触发

  • 相关阅读:
    D. Time to Run【构造】
    P3388 割顶 【求割点个数】
    处女座的测验 素数,构造
    处女座与复读机 DP
    求一个分数小数点后指定位数的数字
    安卓开发创建活动,布局,添加按钮,she使用Toast,设菜单,使菜单相关联等操作
    三进制 处女座的砝码 高精度
    上海高校程序设计联赛 D-CSL的字符串 栈模拟
    区间DP经典 石子合并
    区间DP 洛谷P2858牛奶零食
  • 原文地址:https://www.cnblogs.com/ting0410/p/10581318.html
Copyright © 2011-2022 走看看