微信小程序wx:for和wx:for-item的用法詳解
wx:for="{{list}}"用來循環(huán)數(shù)組,而list即為數(shù)組名wx:for-item="items" 即用來定義一個循環(huán)過程中每個元素的變量的
如果是一維數(shù)組,按照如下方式循環(huán)出來:
<view wx:for="{{list}}">
{{index}} {{item.name}}
</view>
以上代碼中,item即為list的別名。
如果是二維甚至多維數(shù)組,按照如下方式循環(huán):
<view wx:for="{{parentList}}">
{{item.id}}
<view wx:for="{{item.childList}}" wx:for-item="items">
{{items.name}}{{item.account}}
</view>
</view>
for (var i = 0 ; i < list.length; i++) {
var xxx = list[i];
}
等同于
<view wx:for="{{list}}" wx:for-item="xxx"></view>
謹記:wx:for是循環(huán)數(shù)組,wx:for-item即給列表賦別名
以下為幾個錯誤使用,請大家謹慎使用:
1.直接用wx:for-item ,這樣是循環(huán)不出來列表的
<view wx:for-item="{{list}}">
{{index}} {{item.name}}
</view>
2.子循環(huán)中慎用wx:for-item
<view wx:for="{{parentList}}">
{{item.id}}
<view wx:for-item="{{item.childList}}" wx:for-item="items">
{{items.name}}{{items.account}}
</view>
微信小程序wx:for和wx:for-item的正確用法
wx:for="{{list}}"用來循環(huán)數(shù)組,而list即為數(shù)組名wx:for-item="items" 即用來定義一個循環(huán)過程中每個元素的變量的
如果是一維數(shù)組,按照如下方式循環(huán)出來:
<view wx:for="{{list}}">
{{index}} {{item.name}}
</view>
以上代碼中,item即為list的別名。
如果是二維甚至多維數(shù)組,按照如下方式循環(huán):
<view wx:for="{{parentList}}">
{{item.id}}
<view wx:for="{{item.childList}}" wx:for-item="items">
{{items.name}}{{item.account}}
</view>
</view>
for (var i = 0 ; i < list.length; i++) {
var xxx = list[i];
}
等同于
<view wx:for="{{list}}" wx:for-item="xxx"></view>
謹記:wx:for是循環(huán)數(shù)組,wx:for-item即給列表賦別名
以下為幾個錯誤使用,請大家謹慎使用:
1.直接用wx:for-item ,這樣是循環(huán)不出來列表的
<view wx:for-item="{{list}}">
{{index}} {{item.name}}
</view>
2.子循環(huán)中慎用wx:for-item
<view wx:for="{{parentList}}">
{{item.id}}
<view wx:for-item="{{item.childList}}" wx:for-item="items">
{{items.name}}{{items.account}}
</view>
總結(jié)
以上所述是小編給大家介紹的微信小程序wx:for和wx:for-item的用法詳解,希望對大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會及時回復(fù)大家的!
相關(guān)文章
Javascript:為input設(shè)置readOnly屬性(示例講解)
本篇文章主要是對Javascript中為input設(shè)置readOnly屬性的示例代碼進行了介紹。需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12
理解Javascript_02_理解undefined和null
其實在 ECMAScript 的原始類型中,是有Undefined 和 Null 類型的。 這兩種類型都分別對應(yīng)了屬于自己的唯一專用值,即undefined 和 null。2010-10-10
拖動table標題實現(xiàn)改變td的大小(css+js代碼)
拖動列寬的表格table標題同時改變td的大小,本文將以實例演示為大家呈現(xiàn),感興趣的朋友可以參考下哈,希望對你學(xué)習(xí)js或者css有所幫助2013-04-04
詳解基于Vue cli生成的Vue項目的webpack4升級
這篇文章主要介紹了詳解基于Vue cli生成的Vue項目的webpack4升級,本文將詳細介紹從webpack3到webpack4的升級過程,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
跟我學(xué)習(xí)javascript的Date對象
跟我學(xué)習(xí)javascript的Date對象,文章主要介紹了Date 日期和時間對象的操作,文章末尾為大家附加了兩個案例,幫助大家更好的學(xué)習(xí)javascript的Date對象,對這方面感興趣的小伙伴們可以參考一下2015-11-11
詳細談?wù)凧avaScript中循環(huán)之間的差異
JS循環(huán)語句也叫迭代語句,是一種特殊的語句,主要用于需要多次執(zhí)行的代碼塊,下面這篇文章主要給大家介紹了關(guān)于JavaScript中循環(huán)之間的差異的相關(guān)資料,需要的朋友可以參考下2021-08-08
創(chuàng)建與框架無關(guān)的JavaScript插件
這篇文章主要介紹了創(chuàng)建與框架無關(guān)的JavaScript插件,幫助大家更好的理解和使用JavaScript,感興趣的朋友可以了解下2020-12-12

