Detailed explanation of for statement in small program development

Y2J
Release: 2017-05-11 13:39:34
Original
2523 people have browsed it

This article mainly introduces relevant information on the detailed explanation of the for loop of the WeChat applet. Friends in need can refer to

1, wx:for

Use the wx:for control attribute on the component to bind an array, and the component can be repeatedly rendered using the data of each item in the array. The subscript of the current item of the default array Variable namedefaults to index, and the variable name of the current item of the array defaults to item. Examples are as follows:

wxml file:

<view wx:for="{{items}}">
{{index}}: {{item:one}}
</view>
js文件:
Page({
items:[{
one: "test1",
},{
one: "test2"
}]
})
Copy after login

You can use wx:for-item to specify the variable name of the current element of the array

You can use wx:for-index to specify the variable name of the current subscript of the array. Examples are as follows:

wxml file:

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

下面是一个九九乘法表事例:
<view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="i">
<view
 wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="j">
<view
 wx:if="{{i <= j}}">
{{i}}*{{j}} = {{i * j}}
</view>
</view>
</view>
Copy after login

2, block wx:for

wx:for is used in< ;blcok/> tag to render a structure block containing multiple nodes. For example:

<block wx:for="{{[1,2,3]}}">
<view> {{index}}: </view>
<view> {{item}} </view>
</block>
Copy after login

The rendering is as follows:

[Related recommendations]

1. WeChat applet complete source code download

2. WeChat mini program demo: Lezhu

The above is the detailed content of Detailed explanation of for statement in small program development. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!