微信小程序--23(条件渲染)

一、wx:if

1.作用

  • 来判断是否需要渲染

2.语句

  • wx:if = "{{condition}}"

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

  • wx:elif

  • wx:else

  • 用来添加else判断

3.演示

二、<block> +wx:if

1.作用

  • <block>标签:将多个组件包装起来
  • 一次性控制多个组件展示与隐藏

2.练习

  • 没有<block>
  • 有<block>

三、hidden

1.作用

  • 控制元素的显示与隐藏

2.语句

  • hidden ="{{condition}}"

3.练习

  • flag为false
  • flag为true

四、wx:if与hidden比较

1.运行方式不同

  • 前者动态创建和移除元素来控制元素的展示和隐藏
  • 后者以切换的方式

2.使用建议

频繁切换使用后者

控制条件比较复杂,使用前者结合wx:elif、wx:else进行切换

相关推荐
2501_915918411 小时前
TCP 抓包分析在复杂网络问题中的作用,从连接和数据流层面理解系统异常行为
网络·网络协议·tcp/ip·ios·小程序·uni-app·iphone
じòぴé南冸じょうげん2 小时前
APP本地调试正常,但是打包后出现账号密码解析错误,且前端未使用加密解密
小程序·uni-app·web app
小小黑0072 小时前
快手小程序-实现插屏广告的功能
前端·javascript·小程序
计算机毕设指导62 小时前
基于微信小程序的鸟博士系统【源码文末联系】
java·spring boot·mysql·微信小程序·小程序·tomcat·maven
周杰伦fans2 小时前
微信小程序信息提示组件大全
微信小程序·小程序
QQ_21696290962 小时前
Spring Boot大学生社团管理平台 【部署教程+可完整运行源码+数据库】
java·数据库·spring boot·微信小程序
说私域4 小时前
基于开源链动2+1模式、AI智能名片与S2B2C商城小程序的运营创新研究
人工智能·小程序
我很苦涩的4 小时前
原生小程序使用echarts
前端·小程序·echarts
小小王app小程序开发4 小时前
盲盒小程序避坑指南:开发运营全流程风险规避策略
小程序
风月歌6 小时前
基于微信小程序的学习资料销售平台源代码(源码+文档+数据库)
java·数据库·mysql·微信小程序·小程序·毕业设计·源码