>  기사  >  위챗 애플릿  >  WeChat Mini 프로그램 튜토리얼 조건부 렌더링

WeChat Mini 프로그램 튜토리얼 조건부 렌더링

Anani
Anani원래의
2020-05-04 12:34:14136검색

조건부 렌더링

조건부 렌더링이라 불리는 것은 현재 구성 요소를 렌더링할지 여부를 결정하는 데이터 바인딩 표현식의 논리값을 의미합니다. 다음 코드에는 Hidden 속성을 사용하는 코드가 있습니다.

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

위 바코드에서 플래그 변수의 값이 true인 경우 뷰 구성 요소와 포함된 구성 요소가 렌더링되지 않습니다. 플래그 변수의 값이 false인 경우, 보기 구성 요소 출력을 페이지에 렌더링합니다.

wx:if 조건부 렌더링

WeChat 애플릿 wxml 파일에는 유사한 조건부 렌더링을 수행하는 또 다른 방법이 제공됩니다. 이는 wx:if 속성을 사용하여 현재 구성 요소를 제어하는 ​​것입니다.

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

위의 코드에서 조건 변수의 값이 true이면 보기 구성 요소가 출력을 렌더링합니다. 조건 변수가 false이면 보기 구성 요소가 렌더링되지 않습니다.

wx:if 속성은 렌더링 여부를 제어하는 ​​논리 변수가 반대라는 점이 다릅니다. 그러나 wx:if를 사용하면 더 편리하게 제어할 수 있습니다. :if , wx:else 여러 개의 브랜치 코드 블록을 추가하려면 제어 표현식의 값이 true이면 하나의 브랜치가 렌더링되고, false이면 다른 브랜치가 렌더링됩니다.

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

위의 코드를 참조하세요. 코드에서 길이가 3보다 크면 콘텐츠 1이 렌더링되고 길이 값이 3보다 크고 5보다 작으면 인터페이스는 콘텐츠 2를 렌더링하고 출력합니다. 위 조건 중 어느 것도 충족되지 않으면 콘텐츠를 렌더링하고 출력합니다. 3.

현명함은 노력에서 나오고, 지식은 매일의 축적에서 나온다

위 내용은 WeChat Mini 프로그램 튜토리얼 조건부 렌더링의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.