微信小程序 條件渲染詳解
更新時間：2016年10月09日 09:37:11 作者：碼農(nóng)伯伯0丶1
這篇文章主要介紹了微信小程序 條件渲染詳解的相關(guān)資料,需要的朋友可以參考下
1，wx.if
在微信小程序中，小程序是使用wx.if="{{條件}}"來判斷是否渲染該代碼塊，用法如下：
<view wx.if="{{條件}}">True</view>
也可以用wx.elif和wx.else來添加一個else塊，事例如下：
<view wx:if="{{a>1}}"> 1 </view>
<view wx:elif="{{a>2}}"> 2 </view>
<view wx:else> 3 </view>
2，block wx:if
wx:if是一個控制屬性，需要將它添加到標(biāo)簽上，但是如果我們想要一次性判斷多個標(biāo)簽，我用可以使用<block/>將多個組件包裝起來，并在上邊使用wx:if控制屬性，
其中并不是一個組件，它僅僅是一個包裝元素，不會在頁面中做任何渲染，只接受控制屬性。事例如下：
<block wx:if="{{TURE}}">
<view>view1</view>
<view>view2</view>
</block>
注：一般來說，wx:if有更高的切換消耗而hidden有更高的初始渲染消耗。因此，如果需要頻繁切換的情景下，用hidden更好，如果在運行時條件不大可能改變則wx:if較好。
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關(guān)文章
這篇文章主要介紹了微信小程序 Mustache語法詳細介紹的相關(guān)資料,需要的朋友可以參考下2016-10-10
這篇文章主要介紹了微信小程序 UI布局常用技巧整理總結(jié)的相關(guān)資料,現(xiàn)在不論是APP 還是各種軟件，UI布局還是非常重要的，用戶體驗第一位啊，這里就整理下微信小程序的UI布局，需要的朋友可以參考下2016-12-12
實現(xiàn)基于飛書webhook監(jiān)聽github代碼提交
這篇文章主要為大家介紹了實現(xiàn)基于飛書webhook監(jiān)聽github代碼提交示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-01-01
這篇文章主要為大家介紹了TypeScript棧的壓入與彈出序列校驗示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
three.js-結(jié)合dat.gui實現(xiàn)界面可視化修改及調(diào)試詳解
這篇文章主要為大家介紹了three.js-結(jié)合dat.gui實現(xiàn)界面可視化修改及調(diào)試詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-02-02
reduce探索lodash.reduce實現(xiàn)原理解析
這篇文章主要為大家介紹了reduce探索lodash.reduce實現(xiàn)原理示例解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-02-02
這篇文章主要為大家介紹了JS高級程序設(shè)計之class繼承重點示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
這篇文章主要為大家介紹了js?websocket斷線重連實例代碼詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-07-07
這篇文章主要介紹了微信小程序引用的相關(guān)資料,并附簡單實例代碼，需要的朋友可以參考下2016-10-10
這篇文章主要為大家介紹了原生JS以后也支持類型注解意義，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07