小程序循环wx:for基础使用
小程序
2018-10-05 16:23:37
无论是网站,还是小程序,所有一切涉及数据的问题。都不可避免的要接触到关于数据循环的问题。那么在微信小程序中我们如何对数据进行循环处理呢?
开始之前,我们先列举出常用的数据格式:
data:["数据1","数据2","数据3"]
data1:[
{name:"数据1"},
{name:"数据2"},
{name:"数据3"}
]小程序中具体代码块:
wxml部分:(数组格式)
<view class=''>
<block wx:for="{{data}}">
<text>{{item}}</text>
</block>
</view>wxml部分:(数组包含json格式)
<view class=''>
<block wx:for="{{data1}}">
<text>{{item.name}}</text>
</block>
</view>从上面两部分代码,想必大家也看出了其中的不同了吧。
也就只是{{item}}和{{item.name}}的区别
item即数组当前项默认变量名!
wx:for即小程序中循环属性,小程序中wx:for多用在<block/>标签上!当然也可用在view标签上如:
<view class='list-li mflex' wx:for="{{list_data}}" wx:key="index" >
<view class='list-img'><image src='{{item.imgUrl}}'></image></view>
<view class='list-tit'><text>{{item.id}}、{{item.title}}</text></view>
<view class='list-con'><text>单价{{item.unitprice}}元/m²</text></view>
<view class='list-adr'><text>{{item.city}}</text></view>
<view class='list-tag'>
<text class='tag_{{index}}' wx:for="{{item.tag}}" wx:for-item="cell" wx:key="index" >{{cell.tags}}</text>
</view>
</view>关于循环的大致就这么多!希望对你有所帮助!
六月初字帖坊小程序
你想要的字帖模板及工具,这里都有!
899篇文章
2817人已阅读
六月初