舟山闪爸电子技术有限公司

微信小程序條件渲染,用wx:if="{{condition}}"來判斷是否需要渲染該代碼塊

wx:if

在框架中,我們用wx:if="{{condition}}"來判斷是否需要渲染該代碼塊:

微信小程序條件渲染,用wx:if="{{condition}}"來判斷是否需要渲染該代碼塊

<view wx:if="{{condition}}"> True </view>

也可以用wx:elifwx:else來添加一個else塊:

<view wx:if="{{length > 5}}"> 1 </view>
<view wx:elif="{{length > 2}}"> 2 </view>
<view wx:else> 3 </view>

block wx:if

因為wx:if是一個控制屬性,需要將它添加到一個標(biāo)簽上。但是如果我們想一次性判斷多個組件標(biāo)簽,我們可以使用一個<block/>標(biāo)簽將多個組件包裝起來,并在上邊使用wx:if控制屬性。

<block wx:if="{{true}}">
  <view> view1 </view>
  <view> view2 </view>
</block>

注意:<block/>并不是一個組件,它僅僅是一個包裝元素,不會在頁面中做任何渲染,只接受控制屬性。

wx:ifvshidden

因為wx:if之中的模板也可能包含數(shù)據(jù)綁定,所以當(dāng)wx:if的條件值切換時,框架有一個局部渲染的過程,因為它會確保條件塊在切換時銷毀或重新渲染。

同時wx:if也是惰性的,如果在初始渲染條件為false,框架什么也不做,在條件第一次變成真的時候才開始局部渲染。

相比之下,hidden就簡單的多,組件始終會被渲染,只是簡單的控制顯示與隱藏。

一般來說,wx:if有更高的切換消耗而hidden有更高的初始渲染消耗。因此,如果需要頻繁切換的情景下,用hidden更好,如果在運行時條件不大可能改變則wx:if較好。

更多微信小程序開發(fā)教程,可以關(guān)注。
【本站聲明】
  1、本站文章中所選用的圖片及文字來源于網(wǎng)絡(luò)以及用戶投稿,由于未聯(lián)系到知識產(chǎn)權(quán)人或未發(fā)現(xiàn)有關(guān)知識產(chǎn)權(quán)的登記,如有知識產(chǎn)權(quán)人并不愿意我們使用,如果有侵權(quán)請立即聯(lián)系。
  2、本網(wǎng)站不對文章中所涉及的內(nèi)容真實性、準(zhǔn)確性、可靠性負(fù)責(zé),僅系客觀性描述,如您需要了解該類商品/服務(wù)詳細(xì)的資訊,請您直接與該類商品/服務(wù)的提供者聯(lián)系。


KESION 科汛軟件

KESION 科汛軟件是國內(nèi)領(lǐng)先的在線教育軟件及私域社交電商軟件服務(wù)提供商,長期專注于為企業(yè)提供在線教育軟件及社交電商SaaS平臺解決方案。
公司核心產(chǎn)品云開店SaaS社交電商服務(wù)平臺、在線教育SaaS服務(wù)平臺、教育企業(yè)數(shù)字化SaaS云平臺、企微營銷助手、私有化獨立部署品牌網(wǎng)校和在線教育咨詢等。

KESION 不斷通過技術(shù)創(chuàng)新,提供產(chǎn)品和服務(wù),助力企業(yè)向數(shù)字化轉(zhuǎn)型,通過科技驅(qū)動商業(yè)革新,讓商業(yè)變得更智慧!



▼點擊進(jìn)入科汛官網(wǎng)了解更多



上/下篇
  • 美容行業(yè)小程序案例,美容行業(yè)開發(fā)微信小程序

  • 小程序需要服務(wù)器嗎,小程序服務(wù)器配置要求

換一換相關(guān)推薦
精選內(nèi)容
熱點精選