【HarmonyOS4学习笔记】《HarmonyOS4+NEXT星河版入门到企业级实战教程》课程学习笔记(十一)

news2024/11/19 8:53:31

课程地址: 黑马程序员HarmonyOS4+NEXT星河版入门到企业级实战教程,一套精通鸿蒙应用开发

(本篇笔记对应课程第 18 节)

P18《17.ArkUI-状态管理@Observed 和 @ObjectLink》

在这里插入图片描述

第一件事:嵌套对象的类型上加上 @Observed 装饰器 ,这里嵌套的还是 Person 类型,如果嵌套的是其它类型,则这些类型都需要加上 @Observed 装饰器
第二件事:需要给嵌套对象内部的对象加上 @ObjectLink 装饰器

在这里插入图片描述

但现在嵌套对象的内部对象是作为构造方法的参数传递的,不能加 @ObjectLink 装饰器。

在这里插入图片描述

这样来改造一下:定义一个组件,把内部嵌套的对象传给组件,让组件把内部嵌套的对象做成变量,变量就可以加 @ObjectLink 装饰器了,具体这样来做:

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

用代码来实践一下:

完善功能:当任务处于已完成状态时,任务名称变灰且加中划线:

在这里插入图片描述

在这里插入图片描述

此时验证效果,没有生效!为什么呢?因为勾选或取消勾选时,是对每个任务对象的 finished 属性进行重新赋值,对数组中的对象属性的修改,是不能感知到并触发视图更新的。

怎样实现呢?

第一步:给 Task 类加 @Observed 装饰器

在这里插入图片描述

第二步:在子组件中使用 @ObjectLink 接收 item 对象:

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

此时可以看到已经可以实现勾选完成的任务项的名称变成灰色了,说明我们实现了数组中的元素是对象时,修改对象的属性也可以让视图更新了。

解决在子组件中调用父组件中定义的方法:将这个方法作为一个参数传递给子组件

在这里插入图片描述

在这里插入图片描述

此时操作视图发现报错了!

在这里插入图片描述

这是因为:子组件中调用父组件中定义的方法时,方法中的this指向已经不再是父组件了,而是调用方法的子组件,而子组件中并没有对应的数据,所以报错。

怎样解决?在传递方法时为方法绑定this:

在这里插入图片描述

在这里插入图片描述

总结:
1、本节主要讲解了@Observed 和 @ObjectLink 装饰器,它们主要是用来解决 对象内的属性是嵌套对象以及数组中的元素是对象时,这些内部对象的属性变化不能引起视图更新的问题。主要解决方式是:需要监控属性变更的对象类型上添加 @Observed 装饰器,同时给嵌套的对象或者数组元素的这个对象会产生变化的变量上前加上 @ObjectLink 装饰器。一般做法是将这个对象作为参数传递给子组件,在子组件中生明接收变量时就可以加上 @ObjectLink 装饰器 了。

2、子组件调用父组件中的方法:将父组件中的方法作为参数传递给子组件,为了解决传递后this丢失的问题,需要在传递时给方法绑定当前组件实例的this。

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

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

相关文章

晶体振荡器

一、晶振与晶体区别 晶振是有源晶振的简称,又叫振荡器,英文名称是oscillator,内部有时钟电路,只需供电便可产生振荡信号;晶体是无源晶振的简称,也叫谐振器,英文名称是crystal,是无极…

C++第三方库【JSON】— jsoncpp

目录 认识JSON jsoncpp库 安装&使用 认识jsoncpp Json::Value jsoncpp序列化 jsoncpp反序列化 认识JSON JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,采用完全独立于编程语言的文本格式来存储和表示数据,常用于在客户端和服…

深度学习:手撕 RNN(1)-RNN 的直观认识

本文首次发表于知乎,欢迎关注作者。 1. RNN是什么 RNN(Recurrent Neural Network)存在很多变体,为了方便叙述和理解,本文选取一个基本的 RNN 结构进行说明,该结构与 pytorch 中的 RNN 函数([1]…

c语言:strcmp

strcmp函数是用于比较两个字符串的库函数,其功能是根据ASCII值逐一对两个字符串进行比较。 语法:strcmp(str1, str2) 返回值: 如果str1等于str2,则返回0。 如果str1小于str2,则返回负数(具体值取决于C…

Go微服务: 日志系统ELK核心架构设计

微服务日志系统建设 1 )为什么需要日志系统 业务发展越来越庞大,服务器越来越多各种访问日志,应用日志,错误日志量越来越多,无法管理开发人员排查问题,需要到服务器上查日志 2 )Elastic Stack…

Vue从入门到实战 Day08~Day10

智慧商城项目 1. 项目演示 目标:查看项目效果,明确功能模块 -> 完整的电商购物流程 2. 项目收获 目标:明确做完本项目,能够收获哪些内容 3. 创建项目 目标:基于VueCli自定义创建项目架子 4. 调整初始化目录 目…

刷题之和为k的数组(leetcode)

和为k的数组 这个思路一直想不到&#xff0c;参考了官方答案&#xff0c;哈希表记录[0,i]的和 class Solution { public:int subarraySum(vector<int>& nums, int k) {int result0;unordered_map<int, int>map;int pre0;//前缀和&#xff08;前面的和&…

必应崩了?

目录 今天使用必应发现出现了不能搜索&#xff0c;弹出乱码的情况。 搜了一下&#xff0c;发现其他人也出现了同样的问题。 使用Edge浏览器的话&#xff0c;可以试着改一下DNS&#xff0c;有可能会恢复正常&#xff08;等官方修复了记得改回来&#xff09; 使用谷歌浏览器打开…

哪些AI写作软件好用,这三款强大的AI写作软件必知

在当今信息爆炸的时代&#xff0c;AI写作软件逐渐成为许多人提高写作效率和质量的得力助手。面对众多的选择&#xff0c;哪些AI写作软件真正好用呢&#xff1f;以下为大家介绍三款强大的AI写作软件。 第一款&#xff1a;火呱AI写作 它凭借其强大的语言理解和生成能力脱颖而出。…

C++随机数生成神器:rand(),让你的代码更加引人入胜!

更多资源请关注纽扣编程微信公众号 使用 rand 函数可以获取 机数大小是在0到RAND_MAX&#xff0c;值为2147483647&#xff0c;它是在stdlib中定义的&#xff0c;如果我们希望在某个范围内&#xff0c;可以使用 % 结合 / 来实现 但是不难发现&#xff0c;这里获得的随机数是…

k8s 1.24.x之后如果rest 访问apiserver

1.由于 在 1.24 &#xff08;还是 1.20 不清楚了&#xff09;之后&#xff0c;下面这两个apiserver的配置已经被弃用 了&#xff0c;简单的说就是想不安全的访问k8s是不可能了&#xff0c;所以只能走安全的访问方式也就是 https://xx:6443了&#xff0c;所以需要证书。 - --ins…

MySQL 主备环境搭建 docker

MySQL 主备环境搭建 docker 拉取docker镜像 sudo docker pull mysql:8.0 启动容器 docker run -p 3339:3306 --name mysql-master -e MYSQL_ROOT_PASSWORD123456 -d mysql:8.0docker run -p 3340:3306 --name mysql-slave -e MYSQL_ROOT_PASSWORD123456 -d mysql:8.0配置 M…

通过域名接口申请免费的ssl多域名证书

来此加密已顺利接入阿里云的域名接口&#xff0c;用户只需一键调用&#xff0c;便可轻松完成域名验证&#xff0c;从而更高效地申请证书。接下来&#xff0c;让我们详细解读一下整个操作过程。 来此加密官网 免费申请SSL证书 免费SSL多域名证书&#xff0c;泛域名证书。 首先&a…

linux 错误记录(三)

这里的内核源码路径&#xff1a; cd /usr/src/linux-headers-5.4.0-150-generic/ 内核版本&#xff1a; $ uname -r 5.4.0-150-generic 错误现象 ./include/uapi/asm-generic/int-ll64.h:12:10: fatal error: asm/bitsperlong.h: No such file or directory 搜索后是有的 …

STM32控制HC-SR04超声模块获取距离

欢迎入群共同学习交流 时间记录&#xff1a;2024/5/23 一、模块介绍 &#xff08;1&#xff09;引脚介绍 VCC&#xff1a;电源引脚&#xff0c;接单片机3.3/5V GND&#xff1a;电源地 Trig&#xff1a;超声信号触发引脚 Echo&#xff1a;超声信号接收引脚 &#xff08;2&…

热红外传感器

热红外传感器 一、热红外测温原理二、热红外传感器三、MLX90640-D55(MLX90640-BAB)测试 一、热红外测温原理 自然界中当物体的温度高于 绝对零度 时&#xff0c;由于它内部 热运动 的存在,就会不断地向四周辐射电磁波&#xff0c;其中就包含了波段位于0.75&#xff5e;100μm …

Unity Render入门

概述 在unity中渲染相关的组件是和Render关联的&#xff0c;比如我们常见的3D模型中的MeshRender&#xff0c;UI中的RenderCanvas等都是和Render相关联的&#xff0c;相信在unity的学习过程中&#xff0c;一定看到过非常多和Render相关的内容&#xff0c;那让我们学习一下这部…

Invoking “make cmake_check_build_system“ failed

前言&#xff1a; 在看过站内其他的方法且试过之后没奏效之后&#xff0c;偶然&#xff0c;无意间&#xff0c;随手整对了&#xff0c;然后后续在老赵的文档也找到了原因&#xff0c;对的上号&#xff0c;那在此我提出一种新的方法&#xff0c;且很简单的小tips。首先先来看看…

对列表进行统计和计算

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 Python的列表提供了内置的一些函数来实现统计、计算的功能。下面介绍几种常用的功能。 &#xff08;1&#xff09;获取指定元素出现的次数 使用列表…

shell 脚本笔记2

3.env与set区别 env用于查看系统环境变量 set用于查看系统环境变量自定义变量函数 4.常用环境变量 变量名称含义PATH命令搜索的目录路径, 与windows的环境变量PATH功能一样LANG查询系统的字符集HISTFILE查询当前用户执行命令的历史列表 Shell变量&#xff1a;自定义变量 目标…