WeChat 미니 프로그램에서 wx:for 및 wx:for-item 사용

이 글에서는 주로 WeChat 애플릿 wx:for 및 wx:for-item의 올바른 사용법을 소개합니다. wx:for는 루프 배열이고 wx:for-item은 목록에 별칭을 할당하는 것입니다. , 함께 배워봅시다

wx:for="{{list}}"用来循环数组，而list即为数组名wx:for-item="items"는 루프 과정에서 각 요소의 변수를 정의하는 데 사용됩니다

1차원 배열인 경우 다음과 같이 루프합니다.

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

위에서 코드, 항목은 목록의 별칭입니다.

2차원 또는 다차원 배열인 경우 다음과 같이 루프합니다.

<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는 루프 배열이고 wx는 다음과 같습니다. for-item은 목록 별칭에 할당됩니다.

다음은 몇 가지 잘못된 용도이므로 주의해서 사용하세요.

1. wx:for-item을 직접 사용하면 목록이 루프에 표시되지 않습니다

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

2. 하위 루프에서 주의해서 wx를 사용하세요: for-item

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

WeChat 애플릿 wx:for 및 wx:for-item

wx:for="{{list}} "는 배열을 반복하는데 사용되며, list는 배열 이름입니다. wx :for-item="items"는 반복 중 각 요소의 변수를 정의하는 데 사용됩니다. 1차원 배열인 경우 다음과 같이 반복됩니다.

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

위 코드에서 item은 Alias ​​for list입니다.

2차원 또는 다차원 배열인 경우 다음과 같이 루프합니다.

<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는 루프 배열이고 wx는 다음과 같습니다. for-item이 목록 별칭에 할당되었습니다. ​

다음은 몇 가지 잘못된 용도이므로 주의하여 사용하세요.

1 wx:for-item을 직접 사용하면 목록이 루프에 표시되지 않습니다

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

2. 하위 루프에서는 주의해서 wx를 사용하세요. for-item

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

위 내용은 모두의 연구에 도움이 되기를 바랍니다. PHP 중국어 웹사이트를 주목해주세요!

관련 추천:

WeChat 미니 프로그램 개발 시 AppID를 얻는 방법

WeChat 미니 프로그램을 사용하여 사진을 업로드하는 방법

위 내용은 WeChat 미니 프로그램에서 wx:for 및 wx:for-item 사용의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!