【微信小程序】组件生命周期

组件的生命周期

主要的三个函数：

1. created

组件实例被创建好触发，组件在调用Component里的定义的数据data来实例化数据，
此时不能使用setData

2. attached

组件初始化完毕，进入页面节点时被触发。几乎所有的初始化工作都在这里完成。

3. detached

当页面退出时，页面中如果还有节点树，次函数被触发

定义生命周期的方法

可以直接写在Component构造器的第一级参数中，但是不建议。

小程序在2.2.3期，生命周期函数的位置建议写在lifetimes中，优先级要高于第一级参数

如果外部和lifetimes一起定义，只执行优先级高的，即是执行lifetimes里面的

behaviors中的生命周期

behavior中也存在生命周期，引入后同名的生命周期不会覆盖

但是，一个组件中多次引入同一个behavior，这个behavior中的生命周期只会在一个执行段中执行一次

每个组件在被同一个page中多次调用，每次引用都会执行一次生命周期

behavior中的生命周期优先高于组件的

代码实践

组件中

const Behavior = require('my-behavior');
Component({
  behaviors:[Behavior],
  // 一级生命周期函数
  created:function(){
    // 一般作日志记录
    console.log('create')
  },
  attached:function(){
    // 配置相关操作
    console.log('attached')

  },
  detached:function(){
    console.log('detached')
  },
  // 优先级高于一级生命周期 
  lifetimes:{
    created:function(){
      console.log('lifetimes create')
    },
    attached:function(){
      console.log('lifetimes attached')
  
    },
    detached:function(){
      console.log('lifetimes detached')
    },
  },
})

behavior

module.exports = Behavior({
  // 生命周期
  created:function(){
    console.log('behavior created')
  },
  attached:function(){
    console.log('behavior attached')
  },
  detached:function(){
    console.log('behavior detached')
  },
  lifetimes:{
    created:function(){
      console.log('behavior lifetimes created')
    },
    attached:function(){
      console.log('behavior lifetimes attached')
    },
    detached:function(){
      console.log('behavior lifetimes detached')
    },
  },
  properties:{
  },
  data:{

  },
  methods:{}
})

其它生命周期

1. ready：在组件试图层布局完成后执行

2. error：每当组件方法跑出错误时执行