ホームページ WeChat アプレット ミニプログラム開発 ループ用のWeChatアプレットの詳細な説明

ループ用のWeChatアプレットの詳細な説明

Jan 10, 2017 am 10:30 AM

1, wx:for

コンポーネントの wx:for コントロール属性を使用して配列をバインドすると、配列内の各項目のデータを使用してコンポーネントを繰り返しレンダリングできます。デフォルトでは、配列の現在の項目の添字変数名はデフォルトで Index になり、配列の現在の項目の変数名はデフォルトで item になります。

wxml ファイル:

<view wx:for="{{items}}">
{{index}}: {{item:one}}
</view>
js文件:
Page({
items:[{
one: "test1",
},{
one: "test2"
}]
})
ログイン後にコピー

You wx:for-item を使用して、配列の現在の要素の変数を指定できます。 名前

wx:for-index を使用して、配列の現在の添字の変数名を指定できます。 例:

wxml ファイル:

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

2、ブロック wx:for

wx:for は、複数のノードを含む構造ブロックをレンダリングするために タグで使用されます。例:

<block wx:for="{{[1,2,3]}}">
<view> {{index}}: </view>
<view> {{item}} </view>
</block>
ログイン後にコピー

レンダリングは次のとおりです:

微信小程序 for 循环详解

読んでいただきありがとうございます。皆様のお役に立てれば幸いです。このサイトのご支援に感謝いたします!

ループ関連記事の WeChat アプレットの詳細な説明については、PHP 中国語 Web サイトに注目してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)