if 条件渲染:当为真的时候显示,当为假的时候隐藏;

else 条件渲染:当为真的时候隐藏,当为假的时候显示;

<view wx:if="{{true}}">{{text}}</view>
<view wx:else="{{false}}">{{text}}</view>

可以这样玩:

<button bindtap="btnclick">{{text}}</button>
<view wx:if="{{onOff}}">{{text}}</view>
<view wx:else="{{onOff}}">{{text}}</view>

page.js

//获取应用实例
const app = getApp()
Page({
data: {
text: "点击",
message:"不错的孩子!",
onOff: false
},
btnclick:function(){
var onOff = this.data.onOff;
this.setData({text:"hello",onOff:!onOff});
}
})

微信小程序 --- if/else条件渲染的更多相关文章

  1. 微信小程序的视图与渲染

    1.组件的基本使用 <button type="default" > default </button> <button type="pri ...

  2. 微信小程序 教程之引用

    系列文章: 微信小程序 教程之WXSS微信小程序 教程之引用微信小程序 教程之事件微信小程序 教程之模板微信小程序 教程之列表渲染微信小程序 教程之条件渲染微信小程序 教程之数据绑定微信小程序 教程之 ...

  3. 微信小程序富文本渲染组件html2wxml及html2wxml代码块格式化在ios下字体过大问题

    1.组件使用: 之前微信小程序的富文本渲染组件用的wxParse,对普通富文本确实可以,但是对于代码格式pre标签则无法使用. 下面这个html2wxml很不错,可以支持代码高亮. 详细文档:http ...

  4. 如何在微信小程序的模板渲染中使用JS?

    在微信小程序中使用模板渲染时,可能需要用JS对其进行处理. <view class="price text-red text-lg"> <!-- 价格保留两位小数 ...

  5. 「小程序JAVA实战」小程序视图之条件判断(15)

    转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-15/ 小程序里面也是有条件判断的,我相信大家在开发java if和jstl c:if c:when ...

  6. 微信小程序,前端大梦想(二)

    微信小程序的视图与渲染  今天我们从四个方面来了解小程序:   •组件的基本使用  •数据绑定  •渲染标签  •模板的使用     一.组件的基本使用:  微信小程序为我们的开发提供了丰富的UI组件 ...

  7. 微信小程序笔记

    1.文件的作用 js,wxml,wxss,json 所有页面中要用到的变量,都放在可了pages目录下 wxml:类似于html文件 wxss:类似于css文件(类, id, 标签,子代,后代,bef ...

  8. 微信小程序开发参考资料汇总

    不错的微信小程序入门教程:微信小程序入门二: 条件.遍历.网络请求.获取本地图片http://blog.csdn.net/lecepin/article/details/54016701 微信小程序入 ...

  9. 微信小程序结构目录、配置介绍、视图层(数据绑定,运算,列表渲染,条件渲染)

    目录 一.小程序结构目录 1.1 小程序文件结构和传统web对比 1.2 基本的项目目录 二.配置介绍 2.1 配置介绍 2.2 全局配置app.json 2.3 page.json 三.视图层 3. ...

随机推荐

  1. java分布式集群

    http://blog.csdn.net/guzicheng/article/details/11580841

  2. eclipse的Maven项目pom.xml错误信息提示missingxxxjar解决方案

    今天在学习的时候需要用到maven工程,当时找完所依赖的包的三要素就开始下载了,写完pom.xml需要一段时间下载这些jar包,就躺在一边等了.可能是笔记本有节能功能这个原因导致我醒来时断网发现满屏m ...

  3. imx6 spi分析

    /************************************************************************** *本文主要跟踪imx6 spi设备和驱动的注册过 ...

  4. window,centos双系统坏了

    在centos中格式化SD卡的时候,操作错误,误将windows系统C盘的给格式化了.C盘是ntf格式的,现在却变为了fat32的格式. 重启系统,发现还是可以进入到centos,但是window进入 ...

  5. 第二百八十二节,MySQL数据库-MySQL视图

    MySQL数据库-MySQL视图 1.视图是一个虚拟表(非真实存在),其本质是[根据SQL语句获取动态的数据集,并为其命名],用户使用时只需使用[名称]即可获取结果集,并可以将其当作表来使用. 2.也 ...

  6. 单例模式/ java实现附代码 /

    注: 场景和例子出自github的设计模式.传送门:https://github.com/iluwatar/java-design-patterns/tree/master/singleton 意图: ...

  7. e649. 处理焦点改变事件

    component.addFocusListener(new MyFocusListener()); public class MyFocusListener extends FocusAdapter ...

  8. par函数的bg参数-控制图片的背景色

    bg 参数用于控制图片的背景色,默认为白色 代码示例: par(bg = "pink") plot(1:5, 1:5, main = "title", xlab ...

  9. perl 面向对象编程

    今天看到一个perl面向对象编程的例子,充分体现了如何对数据进行封装: 自己模仿写一个读取配置文件的例子, 配置文件的内容如下 samtools_binary = /usr/bin/samtools ...

  10. JavaScript去空格之trim()

    <script> var str=" ab cd "; alert("["+str.trim()+"]"); </scri ...