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实现

    一.分析 一个二叉树节点有三个部分,一个是指向左子树的部分,一个是指向右子树的部分,另外一个是数据部分.可以把这个节点抽象成一个节点对象,给对象有两个节点对象属性和一个数据属性.如下图: 一个二叉树有 ...

  2. PHP 获取图片中的器材信息

    function getExif($img){ $exif = exif_read_data($img, 'IFD0'); return array ( '文件名' => $exif['File ...

  3. 获取页面中更新删除传过来的id

    利用uri辅助函数 $id=$this->uri->segment(4); 其中segment(参数)  是表示你要截取获得第几个数据.

  4. sparkr——报错

    > sc <- sparkR.init() Re-using existing Spark Context. Please stop SparkR with sparkR.stop() o ...

  5. [android] AndroidManifest.xml 详解

    第1部分 标签库+包路径+版本控制 <manifest xmlns:android="http://schemas.android.com/apk/res/android" ...

  6. QListView的子项的ViewMode

    QListView.setViewMode(ViewMode mode) enum QListView::ViewMode Constant    Value    DescriptionQListV ...

  7. dom元素改变监听

    function domChange(domId, callback) { // select the target node var target = document.getElementById ...

  8. jQuery-替换和删除元素

    1.replaceWith方法 用提供的内容替换集合中所有匹配的元素并且返回被替换元素的集合 参数类型说明: 1)普通字符串(可包含各种html标签) 2)jQuery对象 ①使用$函数创建的新元素( ...

  9. Bash 脚本 getopts为什么最后一个參数取不到

    看以下的Bash脚本: #!/bin/bash interval=0 count=0 pid="" while getopts "p:d:n" arg do c ...

  10. WordCount 远程集群源码

    package test; import java.io.IOException; import java.util.StringTokenizer; import org.apache.hadoop ...