Bedingtes Rendering des WeChat Mini-Programm-Tutorials

Bedingtes Rendern

Das sogenannte bedingte Rendern bezieht sich auf den logischen Wert des Datenbindungsausdrucks, um zu bestimmen, ob die aktuelle Komponente gerendert werden soll. Im folgenden Codeabschnitt gibt es einen Codeabschnitt, der das versteckte Attribut verwendet:

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

Wenn im obigen Barcode der Wert der Flag-Variablen wahr ist, werden die Ansichtskomponente und die enthaltenen Komponenten nicht angezeigt Wenn der Wert der Flag-Variable falsch ist, wird die Ausgabe der Ansichtskomponente auf der Seite gerendert.

wx:if bedingtes Rendering

In der WXML-Datei des WeChat-Applets wird eine andere Möglichkeit für ein ähnliches bedingtes Rendering bereitgestellt, nämlich die Verwendung des wx:if-Attributs zur Steuerung der aktuellen Komponente Der Code lautet wie folgt:

<view wx:if= &#39;{{condition}}&#39;>内容</view>

Wenn im obigen Code der Wert der Bedingungsvariablen wahr ist, rendert die Ansichtskomponente die Ausgabe. Wenn die Bedingungsvariable falsch ist, wird die Ansichtskomponente nicht gerendert.

Unserer Meinung nach ähnelt das Attribut wx:if der versteckten Komponente. Der Unterschied besteht darin, dass die logischen Variablen, die steuern, ob gerendert werden soll, zur bequemeren Steuerung verwendet werden können. Sie können wx:if,wx:else verwenden, um mehrere Zweigcodeblöcke hinzuzufügen. Wenn der Wert des Steuerausdrucks wahr ist, wird ein Zweig gerendert, und wenn er falsch ist, wird ein anderer Zweig gerendert.

<view wx:if= &#39;{{length > 3}}&#39;>内容1</view>
<view wx:elif= &#39;{{length < 5}}&#39;>内容2</view>
<view wx:else&#39;>内容3</view>

Wenn im obigen Code die Länge größer als 3 ist, wird Inhalt 1 gerendert. Wenn der Wert der Länge größer als 3 und kleiner als 5 ist, rendert die Schnittstelle Inhalt 2 und gibt ihn aus Wenn keine der oben genannten Bedingungen erfüllt ist, wird Inhalt 3 gerendert.

Klugheit entsteht durch harte Arbeit und Wissen entsteht durch tägliche Anhäufung

Das obige ist der detaillierte Inhalt vonBedingtes Rendering des WeChat Mini-Programm-Tutorials. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!