Render Lists — for:each & iterator

同学们，咱们现在来看看在Lightning Web Components里怎么渲染列表。有两个核心指令，你一定要记住。 第一个叫“for:each”，它更简单直接。在模板里，你通过“for:item”来访问列表里的每一个项目，很方便，就像普通的循环一样。 第二个是“迭代器”，也就是“iterator:iteratorName”。它功能更强，能让你拿到更多信息。比如，你可以通过“iteratorName.value.某个属性名”来访问当前项的值，注意，这里不是直接写“iteratorName.属性名”，一定要加上“.value”才行。同时，它还能提供索引（index）、是不是第一个（first）、是不是最后一个（last）这些属性。 但不管用哪个指令，都必须搭配一个“key”指令。这个键用来唯一标识每一项，必须是唯一的字符串或者数字，不能直接用对象，也不能用索引。因为框架靠这个键来精准识别哪一项发生了变化，然后只重新渲染变化的部分，这样效率才高。而且这个键在运行时会被优化，不会出现在最终的HTML结构里，也就是DOM里看不到它。 怎么选呢？很简单：当你只是做普通的列表遍历，就用“for:each”。但如果你需要给第一项或最后一项加特殊样式，或者要使用索引，那就选迭代器。最后别忘了，这两种指令都支持在模板里写复杂的表达式，灵活度很高。 好了，列表渲染就讲到这里，是不是挺清晰的？接下来我们看看其他特性。