Usage of wx:for and wx:for-item in WeChat mini program

This article mainly introduces the correct usage of WeChat applet wx:for and wx:for-item. wx:for is a loop array, and wx:for-item is to assign an alias to the list. The article lists a few for you. Wrong usage, let’s learn together

wx:for="{{list}}" is used to loop the array, and list is the array namewx:for-item= "items" is used to define the variables of each element during a loop.

If it is a one-dimensional array, loop it out as follows:

<view wx:for="{{list}}">
{{index}} {{item.name}}
</view>

In the above code, item is the alias of list.

If it is a two-dimensional or even multi-dimensional array, loop as follows:

<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];
}

is equivalent to

<view wx:for="{{list}}" wx:for-item="xxx"></view>

Remember: wx:for is a loop array, wx:for-item is to assign an alias to the list

The following are several incorrect uses, please use them with caution:

1. Use wx:for-item directly, so that the list will not appear in the loop

<view wx:for-item="{{list}}">
{{index}} {{item.name}}
</view>

2. Use wx:for- with caution in sub-loops item

<view wx:for="{{parentList}}">
 {{item.id}}
 <view wx:for-item="{{item.childList}}" wx:for-item="items">
 {{items.name}}{{items.account}}
 </view>

The correct usage of WeChat applet wx:for and wx:for-item

wx:for="{{list} }" is used to loop the array, and list is the array name wx:for-item="items" which is used to define the variable of each element during the loop

If it is a one-dimensional array, follow the following The method is looped out:

<view wx:for="{{list}}">
{{index}} {{item.name}}
</view>

In the above code, item is the alias of list.

If it is a two-dimensional or even multi-dimensional array, loop as follows:

<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];
}

is equivalent to

<view wx:for="{{list}}" wx:for-item="xxx"></view>

Remember: wx:for is a loop array, wx:for-item is to assign an alias to the list

The following are several incorrect uses, please use them with caution:

1. Use wx:for-item directly, so that the list will not appear in the loop

<view wx:for-item="{{list}}">
{{index}} {{item.name}}
</view>

2. Use wx:for- with caution in sub-loops item

<view wx:for="{{parentList}}">
 {{item.id}}
 <view wx:for-item="{{item.childList}}" wx:for-item="items">
 {{items.name}}{{items.account}}
 </view>

The above is the entire content of this article. I hope it will be helpful to everyone's study. For more related content, please pay attention to the PHP Chinese website!

Related recommendations:

How to obtain AppID when developing WeChat mini program

How to use WeChat mini program to upload pictures

The above is the detailed content of Usage of wx:for and wx:for-item in WeChat mini program. For more information, please follow other related articles on the PHP Chinese website!