1.1 概念:纯数据字段指的是那些不用于界面渲染的data字段
应用场景:在有些情况下,某些data中的字段既不会展示在界面上,也不会传递给其他组件,仅仅在当前组件内部使用,带有这种特性的data字段适合被设置为纯数据字段
好处:纯数据字段有助于提升页面更新的性能(不懂怎样提升页面的更新性能)
1.2 使用规则
在构造器的options节点中,指定pureDataPattern为一个正则表达式,字段名符合这个正则表达的字段成为纯数据字段
Component({
options:{
//指定所有_开头的数据字段为纯数据字段
pureDataPattern:/^_/
},
data:{
a:true//普通数据字段
_b:true//纯数据字段
}
})
2.1组件全部可用的生命周期函数
生命周期函数 | 参数 | 描述说明 |
created | 无 | 在组件实例刚刚被创建时执行 |
attached | 无 | 在组件实例进入页面节点树时执行(还未渲染) |
ready | 无 | 在组件在视图层布局完成后执行 |
moved | 无 | 在组件实例被移动到节点树另一个位置时执行 |
detached | 无 | 在组件实例被从页面节点树移除时执行 |
error | Object Error | 每当组件方法抛出错误时执行 |
2.2lifetimes节点
在小程序组件中,生命周期函数可以直接定义在Component构造器的第一级参数中,可以在lifetimes字段声明(推荐,其优先级最高)
2.3组件所在页面的生命周期
有时,自定义组件的行为依赖于页面状态的变化,此时就需要用到组件所在页面的生命周期
生命周期函数 | 参数 | 描述 |
show | 无 | 组件所在的页面被展示时执行 |
hide | 无 | 组件所在的页面被隐藏时执行 |
resize | Object Size | 组件所在的页面尺寸变化时执行 |
2.4pageLifetimes节点
组件所在页面的生命周期,需要定义在pageLifetimes节点中
Component({
pageLifetimes:{
show:(){}
hide:(){}
resize:(){}
}
})
2.5案例
展示页面时,随机生成RGB颜色值
//组件js
methods:{
_randomColor(){
this.setData({
_rgb:{
r:Math.floor(Math.random()*256),//Math.floor()向下取整,即像马太效应里的小的让它更小
g:Math.floor(Math.random()*256),
b:Math.floor(Math.random()*256)
}
})
}
}
pageLifetimes:{
show:function(){
this._randomColor()
}
}
Math.floor()函数可参考:http://t.csdn.cn/kole7