鸿蒙Harmony应用开发—ArkTS-ForEach：循环渲染

ForEach基于数组类型数据执行循环渲染。

说明：

从API version 9开始，该接口支持在ArkTS卡片中使用。

接口描述

ForEach(
  arr: Array,
  itemGenerator: (item: Array, index?: number) => void,
  keyGenerator?: (item: Array, index?: number): string => string
)

使用限制

• ForEach必须在容器组件内使用。

• 生成的子组件应当是允许包含在ForEach父容器组件中的子组件。

• 允许子组件生成器函数中包含if/else条件渲染，同时也允许ForEach包含在if/else条件渲染语句中。

• itemGenerator函数的调用顺序不一定和数组中的数据项相同，在开发过程中不要假设itemGenerator和keyGenerator函数是否执行及其执行顺序。例如，以下示例可能无法正确运行：

  let obj: Object
  ForEach(anArray.map((item1: Object, index1: number): Object => {
      obj.i = index1 + 1
      obj.data = item1
      return obj;
    }),
  (item: string) => Text(`${item.i}. item.data.label`),
  (item: string): string => {
      return item.data.id.toString()
  })

  开发建议

  • 建议开发者不要假设项构造函数的执行顺序。执行顺序可能不能是数组中项的排列顺序。

  • 不要假设数组项是否是初始渲染。ForEach的初始渲染在@Component首次渲染时构建所有数组项。后续框架版本中可能会将此行为更改为延迟加载模式。

  • 使用 index参数对UI更新性能有严重的负面影响，请尽量避免。

  • 如果项构造函数中使用index参数，则项索引函数中也必须使用该参数。否则，如果项索引函数未使用index参数，ForEach在生成实际的键值时，框架也会把index考虑进来，默认将index拼接在后面。

    使用场景

    项目索引函数为每个数组项创建唯一且持久的键值，ArkUI框架通过此键值确定数组中的项是否有变化，只要键值相同，数组项的值就假定不变，但其索引位置可能会更改。此机制的运行前提是不同的数组项不能有相同的键值。

    使用计算出的ID，框架可以对添加、删除和保留的数组项加以区分：

    1. 框架将删除已删除数组项的UI组件。

    2. 框架仅对新添加的数组项执行项构造函数。

    3. 框架不会为保留的数组项执行项构造函数。如果数组中的项索引已更改，框架将仅根据新顺序移动其UI组件，但不会更新该UI组件。

    建议使用项目索引函数，但这是可选的。生成的ID必须是唯一的，这意味着不能为数组中的不同项计算出相同的ID。即使两个数组项具有相同的值，其ID也必须不同。

    如果数组项值更改，则ID必须更改。 如前所述，id生成函数是可选的。以下是不带项索引函数的ForEach：

    let list: Object
    ForEach(this.arr,
      (item: Object): string => {
        list.label = item.toString();
        CounterView(list)
      }
    )

    ForEach中使用可选index参数示例

    可以在构造函数和ID生成函数中使用可选的index参数。

    必须正确构造ID生成函数。当在项构造函数中使用index参数时，ID生成函数也必须使用index参数，以生成唯一ID和给定源数组项的ID。当数组项在数组中的索引位置发生变化时，其ID会发生变化。

    此示例还说明了index参数会造成显著性能下降。即使项在源数组中移动而不做修改，因为索引发生改变，依赖该数组项的UI仍然需要重新渲染。例如，使用索引排序时，数组只需要将ForEach未修改的子UI节点移动到正确的位置，这对于框架来说是一个轻量级操作。而使用索引时，所有子UI节点都需要重新构建，这操作负担要重得多。

    最后

    有很多小伙伴不知道学习哪些鸿蒙开发技术？不知道需要重点掌握哪些鸿蒙应用开发知识点？而且学习时频繁踩坑，最终浪费大量时间。所以有一份实用的鸿蒙（HarmonyOS NEXT）资料用来跟着学习是非常有必要的。 

    这份鸿蒙（HarmonyOS NEXT）资料包含了鸿蒙开发必掌握的核心知识要点，内容包含了（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等）鸿蒙（HarmonyOS NEXT）技术知识点。

    希望这一份鸿蒙学习资料能够给大家带来帮助，有需要的小伙伴自行领取，限时开源，先到先得~无套路领取！！

    获取这份完整版高清学习路线，请点击→纯血版全套鸿蒙HarmonyOS学习资料

    鸿蒙（HarmonyOS NEXT）最新学习路线

    

    •  HarmonOS基础技能

      

      • HarmonOS就业必备技能 
      •  HarmonOS多媒体技术

        

        • 鸿蒙NaPi组件进阶

          

          • HarmonOS高级技能

            

            • 初识HarmonOS内核 
            • 实战就业级设备开发

              

              有了路线图，怎么能没有学习资料呢，小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的鸿蒙（OpenHarmony ）学习手册（共计1236页）与鸿蒙（OpenHarmony ）开发入门教学视频，内容包含：ArkTS、ArkUI、Web开发、应用模型、资源分类…等知识点。

              获取以上完整版高清学习路线，请点击→纯血版全套鸿蒙HarmonyOS学习资料

              《鸿蒙 (OpenHarmony)开发入门教学视频》

              

              《鸿蒙生态应用开发V2.0白皮书》

              

              《鸿蒙 (OpenHarmony)开发基础到实战手册》

              OpenHarmony北向、南向开发环境搭建

              

               《鸿蒙开发基础》

              • ArkTS语言
              • 安装DevEco Studio
              • 运用你的第一个ArkTS应用
              • ArkUI声明式UI开发
              • .……

                

                 《鸿蒙开发进阶》

                • Stage模型入门
                • 网络管理
                • 数据管理
                • 电话服务
                • 分布式应用开发
                • 通知与窗口管理
                • 多媒体技术
                • 安全技能
                • 任务管理
                • WebGL
                • 国际化开发
                • 应用测试
                • DFX面向未来设计
                • 鸿蒙系统移植和裁剪定制
                • ……

                  

                  《鸿蒙进阶实战》

                  • ArkTS实践
                  • UIAbility应用
                  • 网络案例
                  • ……

                    

                     获取以上完整鸿蒙HarmonyOS学习资料，请点击→纯血版全套鸿蒙HarmonyOS学习资料

                    总结

                    总的来说，华为鸿蒙不再兼容安卓，对中年程序员来说是一个挑战，也是一个机会。只有积极应对变化，不断学习和提升自己，他们才能在这个变革的时代中立于不败之地。