Complex Expressions — Render Lists

好，我们来聊聊处理列表的两个核心指令：for:each和迭代器。 如果你只需要把一个数组的数据简简单单地显示出来，那用for:each是最省事的，它就是为了基本的重复渲染准备的。但当你想玩出点花样，比如给列表的第一项或最后一项加个不一样的样式，或者你想知道当前是第几个元素，这时候就需要换用更强大的迭代器。迭代器会提供给你first、last和index这些现成的小帮手，省得你自己去判断。 不过啊，有一条铁律一定要记住：不管你是用for:each还是迭代器，都必须给它配上那个key指令。这个key的值必须是字符串或者数字，千万别用对象或者数组索引。因为框架是靠这个key来精准识别每一个数据项的，只有发现哪个项的数据变了，它才会去重新渲染那一个地方，这样性能才会蹭蹭地上去。 那用迭代器的时候，有个小陷阱你们要注意：要拿到当前项真正的数据值，你得通过it.value点儿属性名，对，就是中间要多写一个value，不能直接写it点儿属性名，一偷懒就容易出错。 最后一点，在迭代器的模板里头，你可以放心大胆地写各种复杂的表达式，比如动态绑定的内联样式、if:true这样的条件显示，或者根据数据切换不同的CSS类。这些花活儿，在这里面全部支持，让列表渲染变得既灵活又省心。