HarmonyOS 之 @Require 装饰器自学指南

news2025/4/1 15:03:01

在 HarmonyOS 应用开发工作中,我频繁碰到组件初始化传参校验的难题。在复杂的组件嵌套里,要是无法确保必要参数在构造时准确传入,就极易引发运行时错误,而且排查起来费时费力。一次偶然的机会,我接触到了 @Require 装饰器,它能在编译阶段就对组件构造传参进行严格校验,大大提升了代码的健壮性和开发效率。然而在学习过程中,我发现相关资料零散且缺乏系统性。因此,我决定撰写这篇博客,把自己的学习经验和实践成果分享出来,助力更多开发者快速掌握 @Require 装饰器的使用方法。

1. HarmonyOS 开发文档概述

HarmonyOS 开发文档为开发者提供了全面且细致的指导,涵盖了从基础入门到高级 API 应用的各个方面。当前使用的是 HarmonyOS 5.0.3 (15) 版本,其 API 能力级别为 API 15 Release。详细的版本配套关系可参考版本说明文档,这有助于我们精准地使用适合当前版本的 API 功能。

2. @Require 装饰器概述

2.1 定义与作用

@Require 是一个用于校验 @Prop@State@Provide@BuilderParam 和普通变量(无状态装饰器修饰的变量)是否需要构造传参的装饰器。当它与这些变量结合使用时,在构造自定义组件时,这些变量必须在构造时传参,否则编译将无法通过。

2.2 版本支持情况

  • 从 API version 11 开始,@Require 对 @Prop 和 @BuilderParam 进行校验,并且支持在元服务中使用。
  • 从 API version 12 开始,它对 @State@Provide 和普通变量(无状态装饰器修饰的变量)进行校验。

3. @Require 装饰器的限制条件

3.1 修饰范围限制

@Require 装饰器仅能用于装饰 struct 内的 @Prop@State@Provide@BuilderParam 和普通变量(无状态装饰器修饰的变量)。如果在其他地方使用,会导致代码不符合规范。

3.2 预览器限制

预览器限制场景需要参考 PreviewChecker 检测规则。这意味着在使用预览器查看组件效果时,需要确保代码符合相关规则,否则可能无法正常预览。

4. @Require 装饰器的使用场景

4.1 父子组件传参校验

当 Child 组件内使用 @Require 装饰器和 @Prop@State@Provide@BuilderParam 和普通变量(无状态装饰器修饰的变量)结合使用时,父组件 Index 在构造 Child 时必须传参,否则编译不通过。以下是一个示例代码:

@Entry
@Component
struct Index {
  @State message: string = 'Hi, HarmonyOS';

  @Builder buildTest() {
    Row() {
      Text('Hi, Harmony World')
        .fontSize(40)
    }
  }

  build() {
    Row() {
      Child({ 
        regular_value: this.message, 
        state_value: this.message, 
        provide_value: this.message, 
        initMessage: this.message, 
        message: this.message,
        buildTest: this.buildTest, 
        initBuildTest: this.buildTest 
      })
    }
  }
}

@Component
struct Child {
  @Builder buildFunction() {
    Column() {
      Text('initBuilderParam - Custom')
        .fontSize(40)
        .fontColor('#FF8C00')
    }
  }
  @Require regular_value: string = 'Hi';
  @Require @State state_value: string = "Hi";
  @Require @Provide provide_value: string = "Hi";
  @Require @BuilderParam buildTest: () => void;
  @Require @BuilderParam initBuildTest: () => void = this.buildFunction;
  @Require @Prop initMessage: string = 'Hi';
  @Require @Prop message: string;

  build() {
    Column() {
      Text(this.initMessage)
        .fontSize(40)
        .fontColor('#008080')
      Text(this.message)
        .fontSize(40)
        .fontColor('#008080')
      this.initBuildTest();
      this.buildTest();
    }
    .width('100%')
    .height('100%')
  }
}

在这个示例中,父组件 Index 在构造 Child 组件时,为 Child 组件的所有使用 @Require 装饰的变量都传递了参数,确保了编译的顺利通过。同时,对文本的字体大小和颜色进行了修改,增强了视觉效果。

4.2 使用 @ComponentV2 修饰的组件初始化

使用 @ComponentV2 修饰的自定义组件 ChildPage 通过父组件 ParentPage 进行初始化,因为有 @Require 装饰,所以父组件必须进行构造赋值。以下是示例代码:

@ObservedV2
class Info {
  @Trace name: string = '';
  @Trace age: number = 0;
}

@ComponentV2
struct ChildPage {
  @Require @Param childInfo: Info = new Info();
  @Require @Param state_value: string = "Hi";
  build() {
    Column() {
      Text(`ChildPage childInfo name :${this.childInfo.name}`)
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
        .fontColor('#FF69B4')
      Text(`ChildPage childInfo age :${this.childInfo.age}`)
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
        .fontColor('#FF69B4')
      Text(`ChildPage state_value :${this.state_value}`)
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
        .fontColor('#FF69B4')
    }
  }
}

@Entry
@ComponentV2
struct ParentPage {
  info1: Info = { name: "Charlie", age: 35 };
  label1: string = "HarmonyOS Is Great";
  @Local info2: Info = { name: "Charlie", age: 35 };
  @Local label2: string = "HarmonyOS Is Great";

  build() {
    Column() {
      Text(`info1: ${this.info1.name}  ${this.info1.age}`) 
        .fontSize(40)
        .fontWeight(FontWeight.Bold)
        .fontColor('#8A2BE2')
      ChildPage({ childInfo: this.info1, state_value: this.label1}) 
      Line()
        .width('100%')
        .height(8)
        .backgroundColor('#FF0000').margin(15)
      Text(`info2: ${this.info2.name}  ${this.info2.age}`) 
        .fontSize(40)
        .fontWeight(FontWeight.Bold)
        .fontColor('#8A2BE2')
      ChildPage({ childInfo: this.info2, state_value: this.label2}) 
      Line()
        .width('100%')
        .height(8)
        .backgroundColor('#FF0000').margin(15)
      Button("Update info1&info2")
        .onClick(() => {
          this.info1 = { name: "David", age: 28} 
          this.info2 = { name: "David", age: 28} 
          this.label1 = "New Fantastic Message"; 
          this.label2 = "New Fantastic Message"; 
        })
    }
  }
}

在这个示例中,父组件 ParentPage 在初始化 ChildPage 组件时,为 ChildPage 组件的 childInfo 和 state_value 传递了参数,保证了组件的正常初始化。同时,对文本的字体大小、颜色以及线条的高度、颜色和边距进行了修改,使界面更加美观。

5. 错误场景分析

如果在使用 @Require 装饰器时没有在构造时传参,会导致编译错误。以下是一个错误示例:

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  @Builder buildTest() {
    Row() {
      Text('Hello, world')
        .fontSize(32)
    }
  }

  build() {
    Row() {
      Child()
    }
  }
}

@Component
struct Child {
  @Builder buildFunction() {
    Column() {
      Text('initBuilderParam - Error Case')
        .fontSize(32)
        .fontColor('#FF00FF')
    }
  }
  // 使用@Require必须构造时传参。
  @Require regular_value: string = 'Hello';
  @Require @State state_value: string = "Hello";
  @Require @Provide provide_value: string = "Hello";
  @Require @BuilderParam initBuildTest: () => void = this.buildFunction;
  @Require @Prop initMessage: string = 'Hello';

  build() {
    Column() {
      Text(this.initMessage)
        .fontSize(32)
        .fontColor('#FF00FF')
      this.initBuildTest();
    }
  }
}

在这个示例中,父组件 Index 在构造 Child 组件时没有传递任何参数,由于 Child 组件中的变量使用了 @Require 装饰器,所以这段代码在编译时会报错。同时,对文本的字体大小和颜色进行了修改,方便区分不同的代码部分。

6. 总结

@Require 装饰器在 HarmonyOS 开发中是一个非常实用的工具,它可以帮助我们在编译阶段就发现组件构造传参的问题,避免运行时错误,提高代码的稳定性和可维护性。通过本文的介绍,你应该对 @Require 装饰器的使用有了更深入的理解。在实际开发中,合理运用 @Require 装饰器,能够让你的代码更加健壮,开发过程更加顺畅。

最后希望这篇自学指南能对你有所帮助,让你在 HarmonyOS 开发的道路上更进一步,当然对鸿蒙有兴趣的同学也欢迎点赞、收藏~!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2322926.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于CNN的FashionMNIST数据集识别6——ResNet模型

前言 之前我们在cnn已经搞过VGG和GoogleNet模型了,这两种较深的模型出现了一些问题: 梯度传播问题 在反向传播过程中,梯度通过链式法则逐层传递。对于包含 L 层的网络,第 l 层的梯度计算为: 其中 a(k) 表示第 k层的…

0323-B树、B+树

多叉树---->B树(磁盘)、B树 磁盘由多个盘片组成,每个盘片分为多个磁道和扇区。数据存储在这些扇区中,扇区之间通过指针链接,形成链式结构。 内存由连续的存储单元组成,每个单元有唯一地址,数…

【工作记录】F12查看接口信息及postman中使用

可参考 详细教程:如何从前端查看调用接口、传参及返回结果(附带图片案例)_f12查看接口及参数-CSDN博客 1、接口信息 接口基础知识2:http通信的组成_接口请求信息包括-CSDN博客 HTTP类型接口之请求&响应详解 - 三叔测试笔记…

2024年认证杯SPSSPRO杯数学建模B题(第二阶段)神经外科手术的定位与导航全过程文档及程序

2024年认证杯SPSSPRO杯数学建模 B题 神经外科手术的定位与导航 原题再现: 人的大脑结构非常复杂,内部交织密布着神经和血管,所以在大脑内做手术具有非常高的精细和复杂程度。例如神经外科的肿瘤切除手术或血肿清除手术,通常需要…

Android 12系统源码_系统启动(二)Zygote进程

前言 Zygote(意为“受精卵”)是 Android 系统中的一个核心进程,负责 孵化(fork)应用进程,以优化应用启动速度和内存占用。它是 Android 系统启动后第一个由 init 进程启动的 Java 进程,后续所有…

MOSN(Modular Open Smart Network)-05-MOSN 平滑升级原理解析

前言 大家好,我是老马。 sofastack 其实出来很久了,第一次应该是在 2022 年左右开始关注,但是一直没有深入研究。 最近想学习一下 SOFA 对于生态的设计和思考。 sofaboot 系列 SOFAStack-00-sofa 技术栈概览 MOSN(Modular O…

Flink介绍与安装

Apache Flink是一个在有界数据流和无界数据流上进行有状态计算分布式处理引擎和框架。Flink 设计旨在所有常见的集群环境中运行,以任意规模和内存级速度执行计算。 一、主要特点和功能 1. 实时流处理: 低延迟: Flink 能够以亚秒级的延迟处理数据流,非常…

【gradio】从零搭建知识库问答系统-Gradio+Ollama+Qwen2.5实现全流程

从零搭建大模型问答系统-GradioOllamaQwen2.5实现全流程(一) 前言一、界面设计(计划)二、模块设计1.登录模块2.注册模块3. 主界面模块4. 历史记录模块 三、相应的接口(前后端交互)四、实现前端界面的设计co…

PowerBI,用度量值实现表格销售统计(含合计)的简单示例

假设我们有产品表 和销售表 我们想实现下面的效果 表格显示每个产品的信息,以及单个产品的总销量 有一个切片器能筛选各个门店的产品销量 还有一个卡片图显示所筛选条件下,所有产品的总销量 实现方法: 1.我们新建一个计算表,把…

26考研——查找_树形查找_二叉排序树(BST)(7)

408答疑 文章目录 三、树形查找二叉排序树(BST)二叉排序树中结点值之间的关系二叉树形查找二叉排序树的查找过程示例 向二叉排序树中插入结点插入过程示例 构造二叉排序树的过程构造示例 二叉排序树中删除结点的操作情况一:被删除结点是叶结点…

【行驶证识别】批量咕嘎OCR识别行驶证照片复印件图片里的文字信息保存表格或改名字,基于QT和腾讯云api_ocr的实现方式

项目背景 在许多业务场景中,如物流管理、车辆租赁、保险理赔等,常常需要处理大量的行驶证照片复印件。手动录入行驶证上的文字信息,像车主姓名、车辆型号、车牌号码等,不仅效率低下,还容易出现人为错误。借助 OCR(光学字符识别)技术,能够自动识别行驶证图片中的文字信…

21.Excel自动化:如何使用 xlwings 进行编程

一 将Excel用作数据查看器 使用 xlwings 中的 view 函数。 1.导包 import datetime as dt import xlwings as xw import pandas as pd import numpy as np 2.view 函数 创建一个基于伪随机数的DataFrame,它有足够多的行,使得只有首尾几行会被显示。 df …

LabVIEW FPGA与Windows平台数据滤波处理对比

LabVIEW在FPGA和Windows平台均可实现数据滤波处理,但两者的底层架构、资源限制、实时性及应用场景差异显著。FPGA侧重硬件级并行处理,适用于高实时性场景;Windows依赖软件算法,适合复杂数据处理与可视化。本文结合具体案例&#x…

【NLP 48、大语言模型的神秘力量 —— ICL:in context learning】

目录 一、ICL的优势 1.传统做法 2.ICL做法 二、ICL的发展 三、ICL成因的两种看法 1.meta learning 2.Bayesian Inference 四、ICL要点 ① 语言模型的规模 ② 提示词prompt中提供的examples数量和顺序 ③ 提示词prompt的形式(format) 五、fine-tune VS I…

vue 中渲染 markdown 格式的文本

文章目录 需求分析第一步:安装依赖第二步:创建 Markdown 渲染组件第三步,使用实例扩展功能1. 代码高亮:2. 自定义渲染规则:需求 渲染 markdown 格式的文本 分析 在Vue 3中实现Markdown渲染的常见方法。通常有两种方式:使用现有的Markdown解析库,或者自己编写解析器…

工业4G路由器赋能智慧停车场高效管理

工业4G路由器作为智慧停车场管理系统通信核心,将停车场内的各个子系统连接起来,包括车牌识别系统、道闸控制系统、车位检测系统、收费系统以及监控系统等。通过4G网络,将这些系统采集到的数据传输到云端服务器或管理中心,实现信息…

企业如何平稳实现从Tableau到FineBI的信创迁移?

之前和大家分享了《如何将Tableau轻松迁移到Power BI》。但小编了解到,如今有些企业更愿意选择国产BI平台。为此,小编今天以Fine BI为例子,介绍如何从Tableau轻松、低成本地迁移到国产BI平台。 在信创政策全面推进的背景下,企业数…

蓝桥与力扣刷题(蓝桥 蓝桥骑士)

题目:小明是蓝桥王国的骑士,他喜欢不断突破自我。 这天蓝桥国王给他安排了 N 个对手,他们的战力值分别为 a1,a2,...,an,且按顺序阻挡在小明的前方。对于这些对手小明可以选择挑战,也可以选择避战。 身为高傲的骑士&a…

前端学习笔记--CSS

HTMLCSSJavaScript 》 结构 表现 交互 如何学习 1.CSS是什么 2.CSS怎么用? 3.CSS选择器(重点,难点) 4.美化网页(文字,阴影,超链接,列表,渐变。。。) 5…

31天Python入门——第15天:日志记录

你好,我是安然无虞。 文章目录 日志记录python的日志记录模块创建日志处理程序并配置输出格式将日志内容输出到控制台将日志写入到文件 logging更简单的一种使用方式 日志记录 日志记录是一种重要的应用程序开发和维护技术, 它用于记录应用程序运行时的关键信息和…