十分钟获取小程序的条件渲染（小程序获取数据后如何渲染到页面）

这篇文章给大家带来了一些关于微信小程序的知识，尤其是关于条件渲染的知识。所谓条件渲染就是判断是否将代码渲染到显示页面。下面就一起来看看吧，希望能帮到你。

1.wx:if实现条件渲染。在框架中，使用wx:if=““判断代码块是否需要渲染:

True如果condition的值为true，视图组件将呈现在页面上，否则将不显示。同时也可以与wx:elif和wx:else结合使用，此时可以进行多条件判断是否渲染代码。

组件1组件2组件32.block与wx:if结合使用。因为wx:if是一个控件属性，所以需要将其添加到标签中。如果你想一次判断多个组件标签，你可以使用一个标签来包装多个组件，并在其上使用wx:if控制属性。

视图1视图2注意:它不是一个组件，只是一个包装容器，不会在页面上呈现任何内容。

3.hiden在框架中实现条件渲染，并使用hidden=““来控制组件的显示和隐藏。与前一个不同的是，隐藏组件将始终呈现，只是简单地控制显示和隐藏。

当条件为真时，元素将被隐藏。4.wx:if vs hidden因为wx:if中的模板也可能包含数据绑定，当wx:if的条件值被切换时，框架有一个部分呈现过程，因为它将确保条件块在切换时被破坏或重新呈现。

同时，wx:if也是惰性的。如果初始呈现条件为假，框架将什么也不做，并且只有当条件第一次变为真时，本地呈现才会开始。

相比之下，隐藏要简单得多，组件总是被渲染，只是简单地控制显示和隐藏。

一般来说，wx:if的切换成本较高，hidden的初始渲染成本较高。因此，如果需要频繁切换，最好使用hidden，如果运行时条件不太可能改变，则使用wx:if更好。

【相关学习推荐:小程序学习教程】

以上就是十分钟小程序条件渲染的细节。更多内容请关注主机参考等相关文章！

这几篇文章你可能也喜欢：

• 微信小程序翻译功能上线：现已支持18种语言
• 如何使用微信小程序中的车牌号输入法（如何使用微信小程序中的车牌号输入法进行打印）
• 微信小程序无法获取位置信息怎么办？（微信小程序无法获取位置信息）
• 微信小程序如何实现九宫格跳（如何在小程序中配置九宫格抽奖）
• 如何调节微信小程序的亮度？

本文由主机参考刊发，转载请注明：十分钟获取小程序的条件渲染（小程序获取数据后如何渲染到页面） https://zhujicankao.com/99679.html