微信小程序开发组件生命周期

作者: --时间: 2022-09-29 阅读量:

微信小程序的组件生命周期是指组件自身的一些函数,它们会在特殊时间点或遇到一些特殊框架事件时自动触发。其中最重要的生命周期包括 created、attached、和 detached:

  1. created

    当一个组件实例刚被创建时,created 生命周期会被触发。此时,组件数据 this.data 就是在 Component 构造器中定义的数据 data,不能调用 setData。通常情况下,这个生命周期只应该用于给组件 this 添加一些自定义属性字段。可用的全部生命周期如下表所示:

    生命周期 参数 描述 最低版本
    created 在组件实例刚刚被创建时执行 1.6.3
    attached 在组件实例进入页面节点树时执行 1.6.3
    ready 在组件在视图层布局完成后执行 1.6.3
    moved 在组件实例被移动到节点树另一个位置时执行 1.6.3
    detached 在组件实例被从页面节点树移除时执行 1.6.3
    error Object Error 每当组件方法抛出错误时执行 2.4.1
  2. attached

    在组件完全初始化并进入页面节点树后,attached 生命周期被触发。此时,this.data 已被初始化为组件的当前值,这个生命周期很有用,大多数初始化工作可以在这个时机进行。

  3. detached

    在组件离开页面节点树后,detached 生命周期被触发。退出一个页面时,如果组件还在页面节点树中,则 detached 会被触发。

定义生命周期方法

生命周期方法可以直接定义在 Component 构造器的第一级参数中,如下:

Component({
  attached: function() {
    // 在组件实例进入页面节点树时执行
  },
  detached: function() {
    // 在组件实例被从页面节点树移除时执行
  },
})

自小程序基础库版本 2.2.3 起,组件的生命周期也可以在 lifetimes 字段内进行声明(这是推荐的方式,其优先级最高):

Component({
  lifetimes: {
    attached: function() {
      // 在组件实例进入页面节点树时执行
    },
    detached: function() {
      // 在组件实例被从页面节点树移除时执行
一套系统全搞定
  • 商家管理
  • 商品管理
  • 订单管理
  • 会员管理
  • 营销中心
  • 供应链入驻
  • 财务管理
  • 支付分账
  • 商城直播
免费试用
更多产品任你选
  • B2B2C多用户商城系统

    类天猫&京东模式系统

    介绍方案
  • B2B2B电商交易系统

    全渠道订货/采购及经销商管
    理数字化系统

    获取案例
  • S2B2B电商交易系统

    上下游资源整合数字化解决方

    演示后台
  • 企业集采商城系统

    中大型企业数字化采购与交易
    系统

    模式介绍
  • 员工福利商城系统

    集福利管理、发放于一体的员工福利商城

    马上试用