亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

「小程序JAVA實戰」小程序視圖之條件判斷(15)

小程序里面也是有条件判断的,我相信大家在开发java if和jstl c:if c:when。有人说在程序员眼里只有if else,可见重要性。一起了解下微信小程序额的条件判断吧。源码:https://github.com/limingios/wxProgram.git 中的No.8

小程序的条件判断

  1. 官方的阐述
    >https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/conditional.html

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

ifElse.wxml

<!ifElse.wxml-->
<view class="container">
  <view wx:if="{{age<18}}">未成年</view>
  <view wx:elif="{{age>=18 &&age<=30}}">已成年</view>
  <view wx:elif="{{age>30 &&age<=50}}">壮年,一起关注公众号:编程坑太多给我来点赞</view>
  <view wx:else>已经老了</view>

  <block wx:if="{{false}}">
    <view>这是一个块级元素</view>
    <view>本节是if判断学习</view>
  </block>

  <view hidden='{{true}}'>
  <view>这是一个hidden元素</view>
    <view>hidden判断学习</view>
  </view>
</view>

ifElse.js

//ifElse.js
//获取应用实例
const app = getApp()

Page({
  data: {
    age: 34
  }
})

hidden true很像咱们css里面的display:none 元素是有的,只是屏幕不显示
wx:if 就类似咱们开发的java的jstl标签里面的if,直接元素就没有

PS:条件渲染也是很重要的,业务逻辑判断全靠它了。


點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
全棧工程師
手記
粉絲
1.7萬
獲贊與收藏
1318

關注作者,訂閱最新文章

閱讀免費教程

  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消