微信小程序教程009：条件渲染
文章目录
- 条件渲染
- 1、wx:if
- 2、结合`<block>`使用wx:if
- 3、hidden的使用
- 4、wx:if与hidden的对比
条件渲染
1、wx:if
wx:if 是基于条件的渲染。
- 当条件为 true 时，元素会被渲染；
- 当条件为 false 时，元素不会被渲染。
- 销毁与重建：当条件从 true 变为 false 时，元素会被销毁；
- 当条件从 false 变为 true 时，元素会被重新创建。
- 资源消耗：由于 wx:if 会在条件切换时销毁和重建元素，因此频繁切换时资源消耗较大。
在小程序中，使用wx:if="{{condition}}"来判断是否需要渲染该代码块：
<view wx:if="{{condtion}}">True