001微信小程序wx:for和wx:for-item的正确用法

在开发中,我们经常会遇到展示列表数据的需求,在小程序中需要使用标签 wx:for / wx:for-index / wx:for-item 来实现相关功能,

        wx:for="{{textData}}" : 定义循环,数组名称为 textData

        wx:for-index="textDataIndex" : 定义索引值的名称 textDataIndex

        wx:for-item="textDataItem" : 定义索引值对应项名称 textDataItem

AAA解释说明:一维数组的用法

<block></block>  相当于一个包裹层   里面是要循环的数据信息

textData : [

     {name: "111"},

     {name: "222"},

     {name: "333"},

]

<block  wx:for="{{textData }}"  wx:for-item="items" >                                

     {{index}} {{items.name}}                                                            

</block>                                                                                        

wx:for="{{textData }}"用来循环数组,而list即为数组名;

wx:for-item="items"   相当于起的别名

BBB解释说明:二维数组的用法

<block></block>  相当于一个包裹层   里面是要循环的数据信息

textData : [

     {name: "111",age: 18},

     {name: "222",age: 28},

     {name: "333",age: 38},

]

<block  wx:for="{{textData }}"  wx:for-item="items" >             

   {{index}} {{items.name}}

   {{index}} {{items.age}}

</block>

wx:for="{{textData }}"用来循环数组,而list即为数组名;

wx:for-item="items"   相当于起的别名

发布了106 篇原创文章 · 获赞 20 · 访问量 11万+

猜你喜欢

转载自blog.csdn.net/gujinapenggu5/article/details/88663559