微信小程序day10

properties属性
在小程序组件中,properties 是组件的对外属性,用来接收外界传递到组件中的数据
properties定义

  properties: {
    // 第一种方式:简化的定义方式(没办法指定默认值)
    // max: Number
    //第二种方式:完整的定义方式(可指定默认值)
    max: {
      type: Number,
      value: 10
    }
  },

data和properties的区别
在小程序的组件中,properties 属性和data数据的用法相同,它们都是可读可写的,只不过:
●data更倾向于存储组件的私有数据
●properties更倾向于存储外界传递到组件中的数据

使用setData修改properties的值
由于data数据和properties属性在本质上没有任何区别,因此properties属性的值也可以用于页面渲染,
或使用setData为properties中的属性重新赋值

数据监听器
数据监听器用于监听和响应任何属性和数据字段的变化,从而执行特定的操作。它的作用类似于vue中的
watch侦听器。在小程序组件中,数据监听器的基本语法格式
在这里插入图片描述监听对象属性的变化
数据监听器支持监听对象中单个或多个属性的变化
在这里插入图片描述
监听对象中所有属性的变化
如果某个对象中需要被监听的属性太多,为了方便,可以使用通配符**来监听对象中所有属性的变化
在这里插入图片描述什么是纯数据字段?
概念:纯数据字段指的是那些不用于界面渲染的data字段。
应用场景:例如有些情况下,某些data中的字段既不会展示在界面上,也不会传递给其他组件,仅仅在当
组件内部使用。带有这种特性的data字段适合被设置为纯数据字段。
好处:纯数据字段有助于提升页面更新的性能。

使用规则
在Component构造器的options节点中,指定pureDataPattern为一个正则表达式,字段名符合这个正则表达式的字段将成为纯数据字段

在这里插入图片描述组件主要的生命周期函数
在小程序组件中,最重要的生命周期函数有3个,分别是created、attached、 detached。 它们各自的特点如下:
①组件实例刚被 创建好的时候,created 生命周期函数会被触发
●此时还不能调用setData
●通常在这个生命周期函数中,只应该用于给组件的this添加一些自定义的属性字段
②在组件 完全初始化完毕、进入页面节点树后,attached 生命周期函数会被触发
●此时,this.data 已被初始化完毕
●这个生命周期很有用,绝大多数初始化的工作可以在这个时机进行(例如发请求获取初始数据)
③在组件离开页面节点树后,detached 生命周期函数会被触发
●退出一个页面时,会触发页面内每个自定义组件的detached生命周期函数
●此时适合做一-些清理性质的工作

lifetimes节点
在小程序组件中,生命周期函数可以直接定义在Component构造器的第一-级参数中, 可以在lifetimes字段内进行声明(这是推荐的方式,其优先级最高)。

什么是组件所在页面的生命周期?
有时,自定义组件的行为依赖于页面状态的变化,此时就需要用到组件所在页面的生命周期。
例如:每当触发页面的show生命周期函数的时候,我们希望能够重新生成一一个随机的RGB颜色值。在这里插入图片描述
pageLifetimes节点
组件所在页面的生命周期函数,需要定义在pageLifetimes节点中

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值