条件渲染 -凯发app官方网站

文档中心

小程序

native 渲染

性能与优化

小程序全局配置

acss 语法参考

小程序页面

axml

sjs 语法参考

事件系统

自定义组件

基础能力

基础库

基础库更新日志

小程序的 javascript 引擎

小程序场景值

场景值列表

开发 > 框架 > axml > 条件渲染

更新时间：2022-05-16 15:39:40

贡献者

收藏

订阅更新

我的文档

设置

a:if

在框架中，使用

a:if="{{condition}}"

来判断是否需要渲染该代码块。

<view a:if="{{condition}}"> true view>

也可以使用

a:elif

和

a:else

添加一个

else

块。

<view a:if="{{length > 5}}"> 1 view>

<view a:elif="{{length > 2}}"> 2 view>

<view a:else> 3 view>

block a:if

因为

a:if

是控制属性，需要在标签中使用。如果要一次性判断多个组件标签，可以使用

标签包装多个组件，并使用

a:if

来控制属性。

<block a:if="{{true}}">

<view> view1 view>

<view> view2 view>

block>

说明

：

并不是一个组件，只是一个包装元素，不会在页面中做任何渲染，只接受控制属性。

对比 a:if 与 hidden

●

a:if

中的模板可能包含数据绑定，所以当

a:if

的条件值切换时，框架有局部渲染的过程，用于确保条件块在切换时销毁或重新渲染。此外，

a:if

在初始渲染条件为 false 时，不触发任何渲染动作，当条件第一次变成 true 时才开始局部渲染。

●

hidden

控制显示与隐藏，组件始终会被渲染。

一般来说，

a:if

有更高的切换消耗而

hidden

有更高的初始渲染消耗。因此，在需要频繁切换的情景下，用

hidden

更好。如果在运行时条件改变不多则

a:if

较好。

相关文档

●

●

上一篇：数据绑定下一篇：列表渲染

相关问题

axml常见问题

内容没有解决您的问题？您还可以前往或寻求帮助

该文档对你是否有帮助？

当前页面目录