ホームページ > ウェブフロントエンド > jsチュートリアル > WeChatアプレットwx:forとwx:for-itemの使い方を詳しく解説

WeChatアプレットwx:forとwx:for-itemの使い方を詳しく解説

亚连
リリース: 2018-05-26 17:47:39
オリジナル
5204 人が閲覧しました

この記事では主に 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>
ログイン後にコピー
ログイン後にコピー

上記のコードでは、項目はリストのエイリアスです。

それが 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>
ログイン後にコピー
ログイン後にコピー

上記は私がまとめたもので、将来的には皆さんのお役に立てれば幸いです。

関連記事:

Ajax は mysql データと対話してメッセージボード関数を作成します


Ajax リクエストの async:false と async:true の違いを詳しく説明します


Ajax は登録を実現し、アバターと次に、関数


をアップロードします

以上がWeChatアプレットwx:forとwx:for-itemの使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート