HarmonyOS鸿蒙Next中【快应用】for循环数据不渲染指导案例

HarmonyOS鸿蒙Next中【快应用】for循环数据不渲染指导案例 问题背景： 快应用中执行for指令进行循环渲染，数据不生效，如何处理？

解决方案： for渲染不生效通常是for的写法出现问题导致的，检查for循环的写法是否出现问题，支持的写法如下（其中{{}}可以省略）：

1、“fn”：for=“list”：list为数组对象，默认元素变量为$item。

<template>
    <div class="list-container">
      <div for="{{list}}" tid="id">
         {{$idx}}
         {{$item.id}}
      </div>
      <div for="value in 7">
         {{value}}
      </div>
    </div>
</template>
<script>
    module.exports= {
        data: {
            list: [{id:1}, {id:2}]
        }
    }
</script>

2、"for=“value in list”：value为自定义的元素变量，默认元素索引为$idx。

<template>
    <div class="list-container">
      <div for="value in list" tid="id">
         {{$idx}}
         {{$item.id}}
      </div>
      <div for="value in 7">
         {{value}}
      </div>
    </div>
</template>
<script>
    module.exports= {
        data: {
            list: [{id:1}, {id:2}]
        }
    }
</script>

3、“for=”(index,value) in list"：index为元素索引，value为元素变量。

<template>
    <div class="list-container">
      <div for="(index,value) in list" tid="id">
         {{$idx}}
         {{$item.id}}
      </div>
      <div for="value in 7">
         {{value}}
      </div>
    </div>
</template>
<script>
    module.exports= {
        data: {
            list: [{id:1}, {id:2}]
        }
    }
</script>

容易出错的是第三种用法，需要特别注意与Vue不同，“for="(index,value) in list”的写法中，index需要放在第一位。