当前位置：首页 > news >正文

HarmonyOS鸿蒙-@State@Prop装饰器限制条件

news 来源：原创 2025/5/8 2:15:29

一、组件Components级别的状态管理：

@State组件内状态限制条件

1.@State装饰的变量必须初始化，否则编译期会报错。

// 错误写法，编译报错
@State count: number;// 正确写法
@State count: number = 10;

2.嵌套属性的赋值观察不到。

// 嵌套的属性赋值观察不到
this.title.name.value = 'ArkUI';

3.数组项中属性的赋值观察不到。

// 嵌套的属性赋值观察不到
this.title[0].value = 6;

4.@State不支持装饰Function类型的变量，框架会抛出运行时错误。

5.@State装饰简单使用场景,执行Button组件的更新方法，实现按需刷新。

@Entry
@Component
struct MyComponent {@State count: number = 0;build() {Button(`click times: ${this.count}`).onClick(() => {this.count += 1;})}
}

6.@State支持联合类型和undefined和null

  @State count: number | undefined = 0;

二、@Prop装饰器：父子单向同步限制条件

1.概述

@Prop装饰的变量和父组件建立单向的同步关系：

@Prop变量允许在本地修改，但修改后的变化不会同步回父组件。

当数据源更改时，@Prop装饰的变量都会更新，并且会覆盖本地所有更改。因此，数值的同步是父组件到子组件（所属组件)，子组件数值的变化不会同步到父组件。

2.限制条件

@Prop装饰变量时会进行深拷贝，在拷贝的过程中除了基本类型、Map、Set、Date、Array外，都会丢失类型。例如PixelMap等通过NAPI提供的复杂类型，由于有部分实现在Native侧，因此无法在ArkTS侧通过深拷贝获得完整的数据。

@Prop装饰器不能在@Entry装饰的自定义组件中使用。

3.当使用undefined和null的时候，建议显式指定类型，

遵循TypeScript类型校验，比如：
@Prop a : string | undefined = undefined  是推荐的，
@Prop a: string = undefined    不推荐

4.嵌套传递层数,更建议使用@ObjectLink。

在组件复用场景，建议@Prop深度嵌套数据不要超过5层，
嵌套太多会导致深拷贝占用的空间过大以及GarbageCollection(垃圾回收)，
引起性能问题，此时更建议使用@ObjectLink。

5.@Prop装饰的变量是私有的，只能在组件内访问。

6. @Prop 观察不到第二层的变化, 对于这种嵌套场景，如果class是被@Observed装饰的，可以观察到class属性的变化，@Prop嵌套场景。

@Prop title: Model;
// 可以观察到第一层的变化
this.title.value = 'Hi';
// 观察不到第二层的变化
this.title.info.value = 'ArkUI';

7.@Prop装饰的数据更新依赖其所属自定义组件的重新渲染，所以在应用进入后台后，@Prop无法刷新，推荐使用@Link代替。

8.@Prop装饰状态变量未初始化错误

@Prop需要被初始化，如果没有进行本地初始化的，则必须通过父组件进行初始化。

如果进行了本地初始化，那么是可以不通过父组件进行初始化的。

PS: 看代码中注释部分

@Observed
class Commodity {public price: number = 0;constructor(price: number) {this.price = price;}
}@Component
struct PropChild1 {@Prop fruit: Commodity; // 未进行本地初始化build() {Text(`PropChild1 fruit ${this.fruit.price}`).onClick(() => {this.fruit.price += 1;})}
}@Component
struct PropChild2 {@Prop fruit: Commodity = new Commodity(1); // 进行本地初始化build() {Text(`PropChild2 fruit ${this.fruit.price}`).onClick(() => {this.fruit.price += 1;})}
}@Entry
@Component
struct Parent {@State fruit: Commodity[] = [new Commodity(1)];build() {Column() {Text(`Parent fruit ${this.fruit[0].price}`).onClick(() => {this.fruit[0].price += 1;})// @PropChild1本地没有初始化，必须从父组件初始化PropChild1({ fruit: this.fruit[0] })// @PropChild2本地进行了初始化，可以不从父组件初始化，也可以从父组件初始化PropChild2()PropChild2({ fruit: this.fruit[0] })}}
}

9.使用a.b(this.object)形式调用，不会触发UI刷新

PS: 看代码中注释部分

class Score {value: number;constructor(value: number) {this.value = value;}static changeScore1(score:Score) {score.value += 1;}
}@Entry
@Component
struct Parent {@State score: Score = new Score(1);build() {Column({space:8}) {Text(`The value in Parent is ${this.score.value}.`).fontSize(30).fontColor(Color.Red)Child({ score: this.score })}.width('100%').height('100%')}
}@Component
struct Child {@Prop score: Score;changeScore2(score:Score) {score.value += 2;}build() {Column({space:8}) {Text(`The value in Child is ${this.score.value}.`).fontSize(30)Button(`changeScore1`).onClick(()=>{// 通过静态方法调用，无法触发UI刷新// Score.changeScore1(this.score);   -- 不推荐// 通过赋值添加 Proxy 代理  -- 推荐let score1 = this.score;Score.changeScore1(score1); })Button(`changeScore2`).onClick(()=>{// 使用this通过自定义组件内部方法调用，无法触发UI刷新//  this.changeScore2(this.score);  -- 不推荐// 通过赋值添加 Proxy 代理 -- 推荐let score2 = this.score;this.changeScore2(score2);})}}
}

谢谢大家!!!

文档中心

HarmonyOS鸿蒙-ArkUI状态管理--多种装饰器-CSDN博客

HarmonyOS鸿蒙- 一行代码自动换行技巧_鸿蒙换行-CSDN博客

HarmonyOS鸿蒙 - 判断手机号、身份证(正则表达式)_鸿蒙正则表达式-CSDN博客

HarmonyOS鸿蒙- 延时执行_鸿蒙延迟执行-CSDN博客

HarmonyOS鸿蒙- 跳转系统应用能力_鸿蒙系统应用跳转设置-CSDN博客

HarmonyOS鸿蒙-DevEco Studio工具_select a device first.-CSDN博客

HarmonyOS鸿蒙-@State@Prop装饰器限制条件

一、组件Components级别的状态管理： State组件内状态限制条件 1.State装饰的变量必须初始化，否则编译期会报错。 // 错误写法，编译报错 State count: number;// 正确写法 State count: number 10; 2.嵌套属性的赋值观察不到。 // 嵌套的…...

编程日记 2025/5/8 2:15:29

C# 中的 Task 和 Async/Await

理解 C# 中的 Task 和 Async/Await：提升程序性能的利器前言：在现代应用程序开发中，特别是在设计用户界面（UI）和进行网络请求等 I/O 操作时，异步编程变得尤为重要。C# 提供了一套强大的异步编程模型&#…...

编程日记 2025/5/8 1:57:56

vue.js 基于VueCli自定义创建项目

在使用Vue.js进行项目开发时，我们可以使用Vue CLI来快速创建项目。Vue CLI是一个基于Vue.js的命令行工具，它提供了一套完整的项目脚手架，可以帮助开发者快速搭建Vue.js项目的开发环境。下面我们来详细解析如何使用Vue CLI自定义创建项目&am…...

编程日记 2025/5/8 2:07:36

Java中的反射机制及其应用场景

目录什么是Java反射机制？ 工作原理主要应用场景注意事项总结什么是Java反射机制？ Java反射机制是一种强大的工具，它允许程序在运行时访问、检查和修改其本身的类和对象的信息。通过反射，开发者可以在不知道类的具体实现…...

编程日记 2025/5/7 15:11:15

金融项目实战 03|JMeter脚本实现手工接口测试

目录一、环境说明 1、项目环境搭建 2、Mock说明二、构造测试数据 1、通过系统页面构造 2、通过接口构造 3、通过数据库构造【推荐】 4、案例：构造借款业务数据三、JMeter执行接口测试用例 1、获取图片验证码、获取短信验证码 2、注册脚本 3、登录脚本…...

编程日记 2025/5/6 23:16:39

前端工具汇总

1. vscode 下载地址：https://code.visualstudio.com/ vscode扩展汇总： 1.1 Code Spell Checker（必须安装） 代码拼写检查器 1.2 Auto Close Tag 自动添加HTML/XML的关闭标签 3. Auto Import 自动查找、解析并为所有可用导入…...

编程日记 2025/5/8 2:06:40

【学习路线】Python数据分析（数据科学）详细知识点学习路径（附学习资源）

学习本路线内容之前，请先学习Python的基础知识其他路线： Python基础 >> Python进阶 >> Python爬虫 >> Python数据分析（数据科学） >> Python 算法（人工智能） >> Pyth…...

编程日记 2025/5/6 6:01:16

Flutter 实现验证码输入框学习

学习flutter代码实现一个用于输入验证码的自定义组件，它允许用户输入固定长度的验证码，并在输入完成时触发回调。前置知识点学习 TextStyle TextStyle 是 Flutter 中用于定义文本样式的类。它提供了一组属性来控制文本的外观，如字体大小、…...

编程日记 2025/5/6 15:37:59

import java.lang.annotation.*;Documented Retention(RetentionPolicy.RUNTIME) Target({ElementType.METHOD, ElementType.FIELD, ElementType.PARAMETER}) public interface ExcelStyle {int width() default 0; }/*** 聊天记录*/ Data public class DialogContentInfo {/**…...

编程日记 2025/5/4 17:34:28

汽车基础软件AutoSAR自学攻略(四)-AutoSAR CP分层架构(3) (万字长文-配21张彩图)

汽车基础软件AutoSAR自学攻略(四)-AutoSAR CP分层架构(3) (万字长文-配21张彩图) 前面的两篇博文简述了AutoSAR CP分层架构的概念，下面我们来具体到每一层的具体内容进行讲解，每一层的每一个功能块力求用一个总览图，外加一个例子的图给大家进…...

编程日记 2025/5/5 4:16:02

有收到腾讯委托律师事务所向AppStore投诉带有【水印相机】主标题名称App的开发者吗

近期，有多名开发者反馈，收到来自腾讯科技 (深圳) 有限公司委托北京的一家**诚律师事务所卞，写给AppStore的投诉邮件。邮件内容主要说的是，腾讯注册了【水印相机】这四个字的商标，所以你们这些在AppStore上的app&…...

编程日记 2025/5/1 8:15:11

SpringBoot操作spark处理hdfs文件

SpringBoot操作spark处理hdfs文件 1、导入依赖 <dependency><groupId>org.apache.spark</groupId><artifactId>spark-core_2.12</artifactId><version>3.2.2</version></dependency><depend…...

编程日记 2025/5/8 2:07:59

Spring Boot中的依赖注入是如何工作

Spring Boot 中的依赖注入（Dependency Injection，简称 DI）是通过 Spring 框架的核心机制——控制反转（Inversion of Control，IOC）容器来实现的。Spring Boot 基于 Spring Framework，在应用中自动…...

编程日记 2025/5/7 5:00:01

算法面试1

简述yolov1的网络架构 YOLOv1网络结构包括24层卷积层用来提取图像的特征，2层全连接层回归得到7730（141420）的张量。网络结构大概如下：输入的是4484483通道的图像，就是RGB图像，然后用64个卷积核大小是…...

编程日记 2025/5/8 1:44:25

Android车机DIY开发之软件篇(八)单独编译

Android车机DIY开发之软件篇(八)单独编译 1.CarLauncher单独编译 CarLauncher源码位于 packages/apps/Car/Launcher 用Eclipse ADT 谷歌定制版编译而成，.mk .bp编译 Android13目录如下: alientekalientek:~/packages/apps/Car$ ls Calendar …...

编程日记 2025/5/5 18:03:34

保证Mysql数据库到ES的数据一致性的解决方案

文章目录 1.业务场景介绍1.1 需求分析1.2 技术实现方案 2.业界常用数据一致性方案分析2.1 同步双写方案2.2 MQ异步双写方案2.3 扫表定期同步方案2.4 监听binlog同步方案 1.业务场景介绍 1.1 需求分析某知名的在线旅游平台，在即将到来的春季促销活动之前&#xff…...

编程日记 2025/5/6 15:55:02

Cursor实现go项目配置并实现仓库Gin项目运行

✅作者简介：大家好，我是 Meteors., 向往着更加简洁高效的代码写法与编程方式，持续分享Java技术内容。 🍎个人主页：Meteors.的博客 💞当前专栏：知识备份 ✨特色专栏：知识分享 &#x…...

编程日记 2025/5/1 6:39:54

【网络云SRE运维开发】2025第2周-每日【2025/01/11】小测-【第11章NAT理论和实操考试】解析

文章目录一、选择题二、理论题三、实操题【网络云SRE运维开发】2025第2周-每日【2025/01/11】小测-【第11章NAT理论和实操考试】解析一、选择题在H3C设备上，NAT技术主要用于（ ） A. 提高网络安全性 B. 实现不同网段的通信 C. 将内部私有IP…...

编程日记 2025/4/30 12:06:25

drawDB docker部属

docker pull xinsodev/drawdb docker run --name some-drawdb -p 3000:80 -d xinsodev/drawdb浏览器访问：http://192.168.31.135:3000/...

编程日记 2025/4/23 3:16:13

页面顶部导航栏（Navbar）的功能（Navbar/index.vue）

这段代码是一个 Vue.js 组件，实现了页面顶部导航栏（Navbar）的功能。我将分块分析它的各个部分： 模板 (Template):  <template><div class"navb…...

编程日记 2025/5/6 0:22:12

【人工智能】用Python进行对象检测：从OpenCV到YOLO的全面指南

对象检测是计算机视觉领域的核心任务之一，广泛应用于视频监控、自动驾驶、智能安防等多个场景。随着深度学习技术的发展，基于传统方法的对象检测逐渐被基于神经网络的先进模型所取代。本文将系统地介绍如何使用Python进行对象检测，重点探讨了…...

编程日记 2025/5/5 1:25:48

深度学习从入门到实战——卷积神经网络原理解析及其应用

卷积神经网络CNN 卷积神经网络前言卷积神经网络卷积的填充方式卷积原理展示卷积计算量公式卷积核输出的大小计算感受野池化自适应均值化空洞卷积经典卷积神经网络参考卷积神经网络前言为什么要使用卷积神经网络呢？ 首先传统的MLP的有什么问题呢？ - …...

编程日记 2025/5/4 0:07:08

Flink概念知识讲解之：Restart重启策略配置

Flink概念知识讲解之：Restart重启策略配置当 Task 发生故障时，Flink 需要重启出错的 Task 以及其他受到影响的 Task ，以使得作业恢复到正常执行状态。 Flink 通过重启策略和故障恢复策略来控制 Task 重启：重启策略决定是否可以…...

编程日记 2025/5/3 10:41:54

Golang中使用 Mqtt

MQTT 是一种基于发布/订阅模式的轻量级物联网消息传输协议 ，可以用极少的代码和带宽为联网设备提供实时可靠的消息服务，它广泛应用于物联网、移动互联网、智能硬件、车联网、电力能源等行业。本文主要介绍如何在 Golang 项目中使用 github.com/eclips…...

编程日记 2025/4/29 23:36:24

腾讯云下架印度云服务器节点，印度云服务器租用何去何从

近日，腾讯云下架印度云服务器节点的消息引起了业界的广泛关注。这一变动让许多依赖印度云服务器的用户开始担忧，印度云服务器租用的未来究竟在何方？ 从印度市场本身来看，其云服务市场的潜力不容小觑。据 IDC 报告，到 2…...

编程日记 2025/5/5 0:43:13

STM32内置Flash

一、原理利用flash存储用户数据需要注意查看，用户数据是否会覆盖芯片运行程序。 IAP（在程序中编程）利用程序修改程序本身，和OTA是一个原理。IAP在程序中编程支持任意一种通信下载。 ICP（在电路中编程，通…...

编程日记 2025/5/5 11:25:54

面试：C++类成员初始化顺序

1、非静态数据成员：按它们在类定义的声明顺序初始化，不会按它们在初始化列表的顺序。 2、静态数据成员：在main函数启动之前，并且只初始化一次 3、基类构造函数：如果类从一个或多个基类继承而来，基类的构造…...

编程日记 2025/4/30 19:20:42

约束的笔记

约束的分类为什么需要约束为了保证数据的完整性 ①实体完整性（Entity Integrity）(同一个表中，不能存在两条完全相同无法区分的记录) ②域完整性（Domain Integrity） ③引用完整性（Referential Integ…...

编程日记 2025/5/7 4:37:18

【Docker】安装registry本地镜像库，开启Https功能

下载镜像 docker pull registry:2 需要启动https功能，就要生成服务端的自签名的证书和私钥，以及在docker客户端安装这个经过签名的证书。第一步：生成公私钥信息，第二步，制作证书签名申请文件， 第三步&…...

编程日记 2025/5/6 13:30:27

el-tree拖拽光标错位问题

背景：el-tree实现的分类树增加拖拽功能后，当分类树由于数量较多产生滚动条，如果分类树已滚动，进行拖拽时会造成光标错位的问题: 原因：el-tree拖拽光标定位的高度并未加上滚动的高度解决：将滚动的样式属性放…...

编程日记 2025/5/7 0:03:24

Linux权限

目录一.Linux权限的概念二.Linux权限管理 1.文件访问者的分类 2.文件类型和访问权限 1.文件类型 2.基本权限 3.文件权限的表示方法 1.字符表示法 2.八进制表示法 4.文件权限的相关访问方法 1.chmod 2.chown 3.chgrp 4.粘滞位三.权限总结一.Linux权限的概念 …...

编程日记 2025/5/5 12:27:02

mysql binlog 日志分析查找

文章目录前言一、分析 binlog 内容二、编写脚本结果总结前言高效快捷分析 mysql binlog 日志文件。 mysql binlog 文件很大怎么快速通过关键字查找内容一、分析 binlog 内容通过 mysqlbinlog 命令可以看到 binlog 解析之后的大概样子二、编写脚本编写脚本 search_…...

编程日记 2025/5/4 21:32:34

win32汇编环境，窗口程序中对按钮控件常用操作的示例

;运行效果 ;win32汇编环境，窗口程序中对按钮控件常用操作的示例 ;常用的操作，例如创建按钮控件，使其无效，改变文本，得到文本等。 ;将代码复制进radasm软件里，直接就可以编译运行。重点部分加备注。 ;>&g…...

编程日记 2025/5/2 7:52:16

风水算命系统架构与功能分析

系统架构服务端：Java（最低JDK1.8，支持JDK11以及JDK17）数据库：MySQL数据库（标配5.7版本，支持MySQL8）ORM框架：Mybatis（集成通用tk-mapper，支持myb…...

编程日记 2025/5/7 5:20:06

如何在 Ubuntu 22.04 上安装和配置邮件服务器教程

简介： 在本指南中，我们将演示如何在 Ubuntu 22.04 上安装和配置邮件服务器，因为大中型公司可以从拥有私人邮件服务器中获益匪浅。通过使用邮件服务器，可以密切监视所有电子邮件流量。此外，自定义设置的灵活性使得建立…...

编程日记 2025/5/2 16:59:30

后门原理与实践

实验目录 windows主机与kali虚拟机实现互联互通使用netcat获取主机操作Shell，cron启动使用socat获取主机操作Shell, 任务计划启动使用MSF meterpreter生成可执行文件，利用ncat或socat传送到主机并运行获取主机Shell使用MSF meterpreter生成获取目标主机…...

编程日记 2025/5/5 6:37:37

代理模式详解与应用

代理模式（Proxy Pattern），也称为委托模式或 surrogate 模式，是一种结构型设计模式。它为其他对象提供一个代理以控制对这个对象的访问。通过引入代理对象，可以在不改变原始对象接口的前提下，添加额外的功能…...

编程日记 2025/5/7 17:09:17

C#，动态规划问题中基于单词搜索树（Trie Tree）的单词断句分词（ Word Breaker）算法与源代码

1 分词分词是自然语言处理的基础，分词准确度直接决定了后面的词性标注、句法分析、词向量以及文本分析的质量。英文语句使用空格将单词进行分隔，除了某些特定词，如how many，New York等外，大部分情况下不需要考虑分词…...

编程日记 2025/5/7 17:28:33

基于单片机的智能家居排气扇系统设计

1系统方案设计本设计基于单片机的智能家居排气扇系统采用STM32单片机作为主控制器，通过DHT11温湿传感器和MQ-2烟雾传感器实现温度、湿度、烟雾检测，在自动模式下，可以根据烟雾浓度通过PWM调速的方式自动调节排气扇的速度，而在手…...

编程日记 2025/5/6 11:09:23

基于JAVA+SpringBoot+Vue的二手车交易系统

基于JAVASpringBootVue的二手车交易系统前言 ✌全网粉丝20W,csdn特邀作者、博客专家、CSDN[新星计划]导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末附源码下载链接🍅 哈喽…...

编程日记 2025/5/4 5:45:49

【JVM-2.2】使用JConsole监控和管理Java应用程序：从入门到精通

在Java应用程序的开发和运维过程中，监控和管理应用程序的性能和资源使用情况是非常重要的。JConsole是Java Development Kit（JDK）自带的一款图形化监控工具，它可以帮助开发者实时监控Java应用程序的内存、线程、类加载以及垃圾回收…...

编程日记 2025/5/3 14:35:16

windows及linux 安装 Yarn 4.x 版本

1. 确保系统环境准备 a. 安装 Node.js Yarn 依赖于 Node.js，所以需要先安装 Node.js。前往 Node.js 官网下载并安装适合你的 Windows 版本的 Node.js（推荐 LTS 版本）。安装完成后，打开命令提示符（CMD）或 PowerShell，验证安装：node -v npm -v如果显示版本号，则表示安…...

编程日记 2025/4/29 13:11:02

VS2015 + OpenCV + OnnxRuntime-Cpp + YOLOv8 部署

近期有个工作需求是进行 YOLOv8 模型的 C 部署，部署环境如下系统：WindowsIDE：VS2015语言：COpenCV 4.5.0OnnxRuntime 1.15.1 0. 预训练模型保存为 .onnx 格式假设已经有使用 ultralytics 库训练并保存为 .pt 格式的 YOLOv8 模型…...

编程日记 2025/5/6 21:25:29

1.两数之和--力扣

给定一个整数数组 nums 和一个整数目标值 target，请你在该数组中找出和为目标值 target 的那两个整数，并返回它们的数组下标。你可以假设每种输入只会对应一个答案，并且你不能使用两次相同的元素。你可以按任意顺序返回答案。示例 1…...

编程日记 2025/5/6 7:20:49

MySQL库表的操作

目录一、库的操作 1.1库的创建 1.2字符集和校验规则 1.2.1 查看系统默认字符集以及校验规则 1.2.2 查看数据库支持的字符集 1.2.3 查看数据库支持的字符集校验规则 1.2.4 校验规则对数据库的影响 1.3操纵数据库 1.3.1显示库 1.3.2显示创建语句 1.3.3修改数据库 1.3…...

编程日记 2025/5/4 4:39:19

【强化学习】深度确定性策略梯度算法(DDPG)详解（附代码）

📢本篇文章是博主强化学习（RL）领域学习时，用于个人学习、研究或者欣赏使用，并基于博主对相关等领域的一些理解而记录的学习摘录和笔记，若有不当和侵权之处，指出后将会立即改正，还望谅…...

编程日记 2025/5/7 5:56:17

单片机实物成品-011 火灾监测

火灾监测（20个版本） 版本20： oled显示温湿度烟雾浓度火焰传感器天然气浓度窗户风扇水泵排气系统声光报警语音播报按键WIFI模块 ----------------------------------------------------------------------------- https://www.bilibili.com…...

编程日记 2025/5/2 13:01:57