WeChat ミニ プログラム チュートリアル 条件付きレンダリング

条件付きレンダリング

いわゆる条件付きレンダリングは、データ バインディング式の論理値を参照して、現在のコンポーネントをレンダリングするかどうかを決定します。次のコードには、hidden 属性を使用するコードがあります。

<view class=&#39;content&#39; hidden=&#39;{{flag ? true: false}}&#39;>
    <text>{{hiddencontent}}</text>
 </view>

上記のバーコードでは、フラグ変数の値が true の場合、ビュー コンポーネントと含まれるコンポーネントはレンダリングされません。 flag 変数の値が false の場合、ビュー コンポーネントの出力がページにレンダリングされます。

wx:if 条件付きレンダリング

WeChat アプレットの wxml ファイルでは、wx:if 属性を使用して現在のコンポーネントを制御する、同様の条件付きレンダリングを実行する別の方法が提供されています。コードは次のとおりです。上記のコードでは、条件変数の値が true の場合、ビュー コンポーネントは出力をレンダリングします。条件変数が false の場合、ビュー コンポーネントはレンダリングしません。

私たちの意見では、wx:if 属性は非表示コンポーネントに似ていますが、レンダリングするかどうかを制御する論理変数が逆である点が異なります。ただし、wx:if を使用すると、より便利な制御を行うことができます。 :if 、 wx:else 複数の分岐コード ブロックを追加するには、制御式の値が true の場合は 1 つの分岐がレンダリングされ、false の場合は別の分岐がレンダリングされます。上記のコードを参照してください。コードでは、長さが 3 より大きい場合、コンテンツ 1 がレンダリングされます。長さの値が 3 より大きく 5 より小さい場合、インターフェイスはコンテンツ 2 をレンダリングして出力します。上記の条件がいずれも満たされない場合は、コンテンツをレンダリングして出力します。 3.

賢さは努力から生まれ、知識は日々の積み重ねから生まれます

以上がWeChat ミニ プログラム チュートリアル 条件付きレンダリングの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。