列表渲染（遍历）
在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item。
<!--logs.wxml-->
<view class="log-list">
<view class="arr">
<text>遍历数组对象：</text>
<view wx:for=\'{{items}}\' wx:key="index">
{{index}}：{{item.name}}
</view>
</view>
<view class="number">
<text>遍历数字：</text>
<view wx:for="{{10}}" wx:key="index">
{{index}}：{{item}}
</view>
</view>
<view class="object">
<text>遍历对象：</text>
<view wx:for="{{object}}" wx:key="index">
{{index}}：{{item}}
</view>
</view>
<view class="double">
<text>双层for循环</text>
<view wx:for="{{items}}" wx:key="index">
{{item.name}}
<view wx:for=\'{{item.name}}\' wx:for-item=\'items\' wx:for-index=\'indexs\' wx:key="indexs">
{{indexs}}：{{items}}
</view>
</view>
</view>
</view>
对应log.js
// logs.js
const util = require(\'../../utils/util.js\')
Page({
data: {
items: [
{value: \'first\', name: "局势已无法挽回"},
{value: \'second\', name: "人民有信仰，国家有力量，民族有希望"},
{value: \'third\', name: "快出残影"},
],
object:{
value: \'first\',
name: "局势已无法挽回",
number:3
}
},
onLoad() {
}
})
Key
如果列表中项目的位置会动态改变或者有新的项目添加到列表中，并且希望列表中的项目保持自己的特征和状态（如 <input/> 中的输入内容， <switch/> 的选中状态），需要使用 wx:key 来指定列表中项目的唯一的标识符。
wx:key 的值以两种形式提供：
- 字符串，代表在 for 循环的 array 中 item 的某个 property，该 property 的值需要是列表中唯一的字符串或数字，且不能动态改变。
- 保留关键字 this 代表在 for 循环中的 item 本身，这种表示需要 item 本身是一个唯一的字符串或者数字。
当数据改变触发渲染层重新渲染的时候，会校正带有 key 的组件，框架会确保他们被重新排序，而不是重新创建，以确保使组件保持自身的状态，并且提高列表渲染时的效率。
请发表评论