鸿蒙HarmonyOS实战：渲染控制、路由案例

条件渲染

简单来说，就是动态控制组件的显示与隐藏，类似于vue中的v-if

但是这里写法就是用if、else、else if看起来更像是原生的感觉

效果

循环渲染

我们实际开发中，数据一般是后端返回来的对象格式，对此我们需要进行遍历，或者我们写大量死数据的时候，也不会在组件中去写大量数据，而是通过在外面定义数据，组件內直接遍历即可

这里我们没有写后端，就模拟一下常规的数据

@Entry
@Component
struct Father {
  @State data: string[] = ['A','B','C','D']

  build() {
    Row() {
      Column() {
        ForEach(this.data,(i)=>{
          Row(){
            Text(i).fontSize(30)
          }
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}

我定义了一个数据data，然后通过ForEach这个函数进行遍历

效果就是这样的

我们简单介绍一下ForEach中需要的参数

这是官方的解释，我们翻译一下

第一个参数：是你想要遍历的数据，是必填的

第二个参数：是你遍历后的内容

第三个参数：类似于vue中v-for的key，是