鸿蒙装饰器

@Builder装饰器: 自定义构建函数

自定义组件内构建函数

less 复制代码
@Builder function(){...}

调用的时候可以直接使用this.function()使用

自定义组件内@Builder方法个数不限制,可以在build()函数内调用,也可以在其他自定义函数,但是不能在组件外调用。

全局自定义构建函数

less 复制代码
@Builder function GlobalBuilderFunction(){...}

使用方法GlobalBuilderFunction() 可以被整个应用获取,不允许使用thisbind方法。

如果不涉及组件状态变化,建议使用全局自定义构建方法

参数传递规则

参数的传递主要有两种:按值传递按引用传递两种。

参数的类型必须与声明的类型保持一致。

在自定义构建函数内部,不允许改变参数值。如果需要改变参数值,且同步回调用点,建议使用@Link

按引用传递参数

传递的参数可为状态变量,且状态变量的改变会引起@Builder方法内部的UI刷新。

ArkUI提供 $$作为按引用传递参数的范式

按值传递参数

调用@Builder装饰的函数默认按值传递。当传递的参数为状态变量的时候,状态变量的改变不会引起@Builder方法内的UI刷新。所以当使用状态变量的时候,推荐使用按引用传递

@BuildeParam装饰器:引用@Builder函数

用来装饰指向@Builder方法的变量,可以在初始化自定义组件时对属性进行复制,为自定义组件增加特定的功能。

这个装饰器用于声明任意UI描述的一个元素,类似slot占位符。

初始化@BuilderParam装饰的方法

@BuilderParam装饰的方法只能被@Builder装饰的方法初始化(自定义构建函数)。

参数初始化组件

@BuilderParam装饰的放大可以是有参数和无参数的两种形式,需与指向的@Builder方法类型匹配。

例如:

less 复制代码
// 我们声明一个全局构建函数
@Builder function overBuilder($$:{label:string}){
...
}
// 这里我们用了按引用传递参数的方式

那么我们被@BuilderParam装饰的变量的参数也要采用这样的形式与之匹配。 例如:

typescript 复制代码
@BuilderParam customBuilderParam:($$:{label:string}) => void

尾随闭包初始化组件

就是在初始化自定义组件的时候,组件后紧跟一个大括号{}形成尾随闭包场景。

@Styles装饰器:定义组件重用样式

我们可以理解为这个装饰器可以把我们开发中组件重复的样式设置代码进行抽离成一个方法。

使用说明

  • 当前@Styles仅支持通用属性和通用事件
  • @Styles方法不支持带参数
  • @Styles可以定义在组件内或全局,在全局定义时需要在方法前添加function关键字。和自定义构建函数是一样的
  • 定义在组件内的@Styles可以通过this访问组件的常量和状态变量,并可以在@Styles里通过时间来改变状态变量的值
  • 组件内的@Styles优先级高于全局@Styles,框架优先找当前组件内的@Styles,如果找不到,则会全局查找

@Extend装饰器:定义扩展组件样式

使用说明

语法

java 复制代码
@Extend(UIcompinentName) function functionName{...}

使用规则

  • @Extend仅支持定义在全局,不支持组件内定义
  • @Extend支持封装指定组件的私有属性、私有事件和自身定义的全局方法
  • @Extend支持代参数,参数可以为function,也可以为状态变量(当状态变量改变的时候,UI可以正常被帅鑫渲染)

stateStyles:多态样式

概述

stateStyles是属性方法,可以根据UI内部状态来设置样式,类似于css伪类,但是语法不同。 ArkUI提供以下四种状态:

  • focused : 获焦态
  • normal :正常态
  • pressed: 按压态
  • disabled : 不可用态
    这样我们就可以通过组件的不同状态对组件进行不同状态下的样式设置,也可以配合着@Styles装饰器一起使用
相关推荐
小雨下雨的雨10 小时前
HarmonyOS V2状态管理深度解析:列表数据与分页架构
华为·架构·harmonyos·鸿蒙
坚果派·白晓明20 小时前
【鸿蒙PC】SDL3 适配:AtomCode + Skills 快速集成 NAPI 测试工具
c++·华为·ai编程·harmonyos·atomcode
YM52e21 小时前
男孩子在外自我保护指南——用鸿蒙 ArkTS 构建交互式安全教育应用
学习·安全·华为·harmonyos·鸿蒙·鸿蒙系统
祭曦念1 天前
古诗小集开发实战:从零开发一款 HarmonyOS 古诗鉴赏应用
pytorch·深度学习·harmonyos
全栈若城1 天前
HarmonyOS AppUtil 应用配置控制:颜色模式/灰度/字体/语言/键盘避让详解
华为·harmonyos·arkts·harmonyos6·键盘避让·字体缩放
FrameNotWork1 天前
HarmonyOS 6.1 Lottie动画集成完全指南:从踩坑到精通
华为·harmonyos
三声三视1 天前
Electron 本地图片在鸿蒙 PC 上白图,我注册了个自定义协议
electron·harmonyos·鸿蒙
李二。1 天前
日历日程管理工具 — 基于 HarmonyOS NEXT (API 23+) 的 ArkTS 纯声明式实现
华为·harmonyos
金启攻1 天前
鸿蒙原生应用实战(三):搜索与详情页 —— 多维度筛选与动态路由
华为·harmonyos