记录一下wxml的条件渲染,
1.使用wx:if
①wxml的代码
<view wx:if="{{condition}}">True</view>
<view wx:if="{{length > 5}}"> length>5 </view>
<view wx:elif="{{length > 2}}"> length>2 </view>
<view wx:else> 其他 </view>
②在js的data为condition赋值为true,length赋值为6
③效果图↓
2.block wx:if,用block对一组view进行组装,可以控制一组view的显示与隐藏
<block wx:if="{{true}}">
<view> view1 </view>
<view> view2 </view>
</block>
为true时显示,为false时隐藏。
与hidden的区别:
①block wx:if条件值切换时,会发生局部渲染;且它是惰性的,初始渲染时为false什么都不做,只有初次为true时才进行渲染。
②hidden不管初始值是什么,均进行渲染,只是显示与隐藏的区别。
因此,有多次切换时,使用hidden效率更高;值基本不变时,使用wx:if的效率更高。