联系我们 - 广告服务
您的当前位置:主页 > 实战 > 前端 >

条件渲染

来源:未知 编辑:admin 时间:2018-02-02
导读: 条件语句可用于.wxml中的条件渲染,不同的条件可以进行不同的渲染。wx:if在框架中,我们用wx:if="{{condition}}"来判断是否需要渲染该组件,条件语句为true的时候,所在组件才会被渲染,写法如下: 也可以用wx:elif和wx:else来添加一个else块,elif相当
条件语句可用于.wxml中的条件渲染,不同的条件可以进行不同的渲染。wx:if在框架中,我们用wx:if="{{condition}}"来判断是否需要渲染该组件,条件语句为true的时候,所在组件才会被渲染,写法如下:

也可以用wx:elif和wx:else来添加一个else块,elif相当于js语法中的else if:


  当length为4的时候只有第二个view组件被渲染了,显示内容为2。block wx:if因为wx:if是一个控制属性,需要将它添加到一个标签上。但是如果想一次性判断多个组件标签,则可以使用一个<block/>标签将多个组件包装起来,并在上面使用wx:if控制属性。

注意:<block/>并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性。wx:if vs hidden除了通过条件渲染控制是否显示和隐藏组件,还可以通过View的属性hidden控制,如下:

hidden属性默认值是true,下面的写法效果是一样的:

wx:if和hidden有什么区别呢?因为wx:if之中的模板也可能包含数据绑定,所以当wx:if的条件值切换时,框架有一个局部渲染的过程,因为它会确保条件块在切换时销毁或重新渲染。同时wx:if也是惰性的,如果初始渲染条件为false,那么框架什么也不做,在条件第一次变成真的时候才开始局部渲染。相比之下,hidden就简单多了,组件始终会被渲染,只是简单地控制显示与隐藏。一般来说,wx:if有更高的切换消耗,而hidden有更高的初始渲染消耗。因此,在需要频繁切换的情景下,用hidden更好,如果在运行时条件不大可能改变,则用wx:if较好。
责任编辑:admin

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

上一篇:数据绑定
下一篇:没有了

网友评论:

在“\templets\demo\comments.htm”原来的内容全部删除,插入第三方评论代码,如果不需要评论功能,删除comments.html里面的内容即可
推荐使用友言、多说、畅言(需备案后使用)等社会化评论插件

Copyright © Tricks资讯网 版权所有
本站所有资讯来源于网络 如有侵权请联系QQ:940910888 技术支持鹏博科技
Top