条件渲染顾名思义所谓的条件渲染，就是通过条件来判断是否需要渲染该代码块。条件渲染主要是用到wx:if和block wx:if这两个，第一个相信好理解，第二个是在block里面进行条件渲染，这里我们特别说明一下< block/>并不是一个组件，它仅仅是一个包装元素，不会在页面中做任何渲染，只接受控制属性。和我们以前的逻辑编程类似，既然有了wx:if ，那么我们也会有wx:elseif和wx.else，这几个组合起来，可以使条件渲染更加灵活。
在这里官方文档中提到了一个wx:if和hidden的对比，通过合理的运用这两种方法可以使你的程序更优。下面我们就是说说他们俩的区别：
因为wx:if之中也可能包含数据绑定，所以当wx:if的条件值切换时，框架有一个局部渲染的过程，他会确保条件在切换是销毁或者重新渲染。同时wx:if也是有惰性的，如果初始渲染条件为false,框架什么也不会做，只有在条件第一次变为真的时候才会开始渲染。相比之下hidden就简单的多，组件始终都会被渲染，只是简单的控制显示和隐藏，一般来说，wx：if 有更高的切换消耗，而hidden有更高的初始渲染消耗，你可以根据自己的需求来调用。
wx:if 与 hidden都可以控制微信小程序中元素的显示与否。
wx:if是遇 true显示，hidden是遇 false显示。
他们还有一层细微的区别：
wx:if在隐藏的时候不渲染，而 hidden在隐藏时仍然渲染，只是不呈现。
所以如果频繁切换的话，用 wx:if将会消耗更多资源，因为每次呈现的时候他都会渲染，每次隐藏的时候，他都会销毁。
如果切换并不频繁的话，用 wx:if相对来说较好些，因为它会避免初始就一下渲染那么多。
总结
频繁切换：用 hidden。偶尔切换：用 wx:if。
示例：下方例子 wx:if中变量为true，进行渲染，false销毁；
<!--回到顶部 --><view class="com-widget-goTop" bindtap="goTop" wx:if="{{floorstatus}}"><view class="icon-gotop">顶部</view></view>
示例二：下方例子 hidden中变量为false，进行渲染，true进行隐藏，不销毁；（wxml）和（js）
<a class="reply" bindtap="reply" data-cid="{{comment.c_id}}">回复</a><!-- 点击回复，展示以下回复form --><view wx:if="{{comment.c_id==reply_id}}" hidden="{{reply}}" class="reply_box"><form bindsubmit="commentForm" report-submit > <textarea name="evaContent" maxlength="50" value="回复 {{comment.username}}:" class="textarea" /> <input hidden="true" name="comment_pid" value="{{comment.c_id}}" /><input hidden="true" name="comment_user" value="回复 {{comment.username}}:" /><button class="save_btn" form-type="submit">发送</button></form></view>
reply: function (e) {var that = this;// 回复form隐藏、展示切换if (that.data.reply == true) {that.setData({reply: false//展示回复框})} else {that.setData({reply: true//隐藏回复框})}that.setData({reply_id: e.currentTarget.dataset.cid //用户点击回复的评论id })},
