鸿蒙 - arkTs:渲染(循环 - ForEach,判断 - if)

ForEach循环渲染:

参数:

  1. 要循环遍历的数组,Array类型
  2. 遍历的回调方法,Function类型
  3. 为每一项生成唯一标识符的方法,有默认生成方法,非必传

使用示例: 

interface Item {name: String,price: Number
}@Entry
@Component
struct Index {private arr:Array<Item> = [{name: '华为 Meta 50', price: 6999},{name: '华为 Meta 60 pro', price: 7999},{name: '华为 Meta X5', price: 12999},];build() {Column({space: 30}) {ForEach(this.arr,item=>{Row(){Column() {Text(item.name).fontWeight(FontWeight.Bold).margin({bottom: 10})Text('¥' + item.price)}}.width('100%').backgroundColor("#FFF").padding(20)})}.height('100%').backgroundColor("#999").justifyContent(FlexAlign.Center)};
}

效果展示:


if判断渲染:

使用示例:

interface Item {name: String,price: Number,discount?: Number
}@Entry
@Component
struct Index {private arr:Array<Item> = [{name: '华为 Meta 50', price: 6999, discount: 6666},{name: '华为 Meta 60 pro', price: 7999},{name: '华为 Meta X5', price: 12999},];build() {Column({space: 30}) {ForEach(this.arr,item=>{Row(){Column() {if(item.discount){Text(item.name).fontWeight(FontWeight.Bold).margin({bottom: 10})Text('原价:¥' + item.price).fontSize(14).decoration({ type: TextDecorationType.LineThrough })Text('折扣价:¥' + item.discount).textAlign(TextAlign.Start)Text('补贴:¥' + (item.price - item.discount)).textAlign(TextAlign.Start)}else{Text(item.name).fontWeight(FontWeight.Bold).margin({bottom: 10})Text('¥' + item.price)}}}.width('100%').backgroundColor("#FFF").padding(20)})}.height('100%').backgroundColor("#999").justifyContent(FlexAlign.Center)};
}

效果展示:

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

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

相关文章

作物模型中引入灌溉参数

在没有设置灌溉时,土壤水分模拟结果如下找到了PCSE包中田间管理文件的标准写法 在agromanager.py中有详细的信息(如何设置灌溉以及施肥量) Version: 1.0 AgroManagement: - 2022-10-15:CropCalendar:crop_name: sugar-beetvariety_name:

HarmonyOS ArkTS 中DatePicker先择时间 路由跳转并传值到其它页

效果 代码 代码里有TextTimerController 这一种例用方法较怪&#xff0c;Text ,Button Datepicker 的使用。 import router from ohos.router’则是引入路由模块。 import router from ohos.router Entry Component struct TextnewClock {textTimerController: TextTimerContr…

管理类联考——数学——真题篇——按题型分类——充分性判断题——蒙猜E

老老规矩&#xff0c;看目录&#xff0c;平均每年2E&#xff0c;跟2D一样&#xff0c;D是全对&#xff0c;E是全错&#xff0c;侧面也看出10道题&#xff0c;大概是3A/B&#xff0c;3C&#xff0c;2D&#xff0c;2E&#xff0c;其实还是蛮平均的。但E为1道的情况居多。 第20题…

Postgresql中自增主键序列的使用以及数据传输时提示:错误:关系“xxx_xx_xx_seq“不存在

场景 Postgresql在Windows中使用pg_dump实现数据库(指定表)的导出与导入&#xff1a; Postgresql在Windows中使用pg_dump实现数据库(指定表)的导出与导入-CSDN博客 上面讲使用pg_dump进行postgresql的导出与导入。 如果使用Navicat可以直接连接两个库&#xff0c;则可直接使…

材料论文阅读/中文记录:Scaling deep learning for materials discovery

Merchant A, Batzner S, Schoenholz S S, et al. Scaling deep learning for materials discovery[J]. Nature, 2023: 1-6. 文章目录 摘要引言生成和过滤概述GNoME主动学习缩放法则和泛化 发现稳定晶体通过实验匹配和 r 2 S C A N r^2SCAN r2SCAN 进行验证有趣的组合家族 扩大…

通用的java中部分方式实现List<自定义对象>转为List<Map>

自定义类 /*** date 2023/12/19 11:20*/ public class Person {private String name;private String sex;public Person() {}public Person(String name, String sex) {this.name name;this.sex sex;}public String getName() {return name;}public String getSex() {return…

鸿蒙Harmony4.0开发-ArkTS基础知识运用

概念 1.渲染控制语法&#xff1a; 条件渲染&#xff1a;使用if/else进行条件渲染。 Column() {if (this.count > 0) {Text(count is positive)} }循环渲染&#xff1a;开发框架提供循环渲染&#xff08;ForEach组件&#xff09;来迭代数组&#xff0c;并为每个数组项创建…

2023人物专访「中国新时代艺坛楷模」蓝弘艺术专题报道

蓝弘&#xff0c;名文珺&#xff0c;广东客家人。十六届人大代表&#xff0c;广州蓝弘艺术中心创办人&#xff0c;民建中央画院广东分院副院长&#xff0c;广东省美术家协会会员&#xff0c;广州江海地区书画家协会会长。 蓝弘画家被世界教科组织联合协会评为“世界艺术大使”…

【操作系统】快速做题向 优先权调度(抢占式/非抢占式)算法做题步骤分析

理论知识理解上面这几句话就行。 抢占&#xff0c;非抢占的区别就是&#xff0c;能不能直接中断某正在进行的优先级没我高的进程的运行。 非抢占只要某进程已经在运行了&#xff0c;后面不论出现多少优先级多高的进程&#xff0c;都得老老实实等待这个进程运行完毕&#xff0…

RuntimeError: Inference tensors do not track version counter.

问题&#xff1a; Testing DataLoader 0: 0%| | 0/78 [00:00<?, ?it/s]Failed to collect metadata on function, produced code may be suboptimal. Known situations this can occur are inference mode only compilation involving resize_ or prims (!sc…

NFC标签写入网址,NTAG213写入网址URL

NFC标签常用的有NTAG213,/215/216以及国产的F8123&#xff0c;可以写入网址&#xff0c;应用在产品身份识别&#xff0c;溯源&#xff0c;防伪等&#xff0c;我们使用NFC读写器ACR122u可以批量快速的写入网址URL 一、打开软件 二、把需要写的网址&#xff0c;整理到Excel表格中…

mysql中的数据类型和表操作【MYSQL】

mysql中的数据类型和表操作MYSQL】 一. 表结构操作1.1创建及删除表结构i. 创建表ii. 查看表结构iii. 删除表 1.2 修改表结构i. 修改表名ii. 添加新字段iii. 修改字段中的属性iiii. 删除字段 二. 表中类型2.1 int类型2.2 bit类型2.3 浮点类型i. float类型ii. decimal类型 2.4 字…

智能优化算法应用:基于黑寡妇算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于黑寡妇算法3D无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于黑寡妇算法3D无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.黑寡妇算法4.实验参数设定5.算法结果6.参考文…

LeetCode刷题--- 子集

个人主页&#xff1a;元清加油_【C】,【C语言】,【数据结构与算法】-CSDN博客 个人专栏 力扣递归算法题【 http://t.csdnimg.cn/yUl2I 】【C】 【 http://t.csdnimg.cn/6AbpV 】数据结构与算法【 http://t.csdnimg.cn/hKh2l 】 前言&#xff1a;这个专栏主要讲…

【BEV感知】BEVFormer 融合多视角图形的空间特征和时序特征 ECCV 2022

前言 本文分享BEV感知方案中&#xff0c;具有代表性的方法&#xff1a;BEVFormer。 它基于Deformable Attention&#xff0c;实现了一种融合多视角相机空间特征和时序特征的端到端框架&#xff0c;适用于多种自动驾驶感知任务。 主要由3个关键模块组成&#xff1a; BEV Que…

【源码】基于SpringBoot+thymeleaf实现的快递之家管理系统

系统介绍 基于SpringBootthymeleaf实现的快递之家管理系统是为学校打造的高效的快递管理系统&#xff0c;系统分为管理员、注册用户两类角色&#xff0c;一共是分为三大菜单项&#xff0c;分别是我的物流、个人管理、后台管理&#xff0c;管理员拥有全部菜单&#xff0c;注册用…

【大数据实训】python石油大数据可视化(八)

2014到2020年石油加工产品产量数据处理分析 一、任务描述 石油是工业的命脉。 一直到2020年&#xff0c;我国原油产量基本处于平稳的状态&#xff0c;大部分原油来自国外进口&#xff1b;中国原油加工产量在华东、东北地区占比较大&#xff0c;华南地区相对较少。原油的加工企业…

打破枯燥工作日,用Python统计键盘和鼠标点击次数,钉钉告诉你今天摸鱼了多少次!

1 前言 是否曾想过&#xff0c;在一天的工作中&#xff0c;你到底点击了键盘多少次&#xff0c;或者鼠标点击了多少下&#xff1f; 是否好奇每天工作的时候&#xff0c;自己究竟有多努力&#xff1f; 本文将带你使用 Python&#xff0c;利用 pynput 监听键盘和鼠标事件&…

关于SSL证书常见的那些误区,你“中”了吗

随着数据安全的重要性越来越凸显&#xff0c;使用SSL证书以实现网站HTTPS加密保护及身份的可信认证成为各政企网站的广泛选择。然而很多网站运营者对于SSL证书的理解仍然存在一些误区&#xff0c;为了能让大家对SSL证书有更为清晰的认识&#xff0c;下面小锐就带大家一起来了解…