切换的表示

<!--index.wxml-->
<view class="container">
<view class="item">
<view class="title" bindtap="toggle">
<text>切换面板展示</text>
</view>
<!-- block 只是控制属性(wx:)的载体,页面渲染过程中没有实际意义 -->
<!--<block wx:if="{{ show }}">
<view class="content">
<text>
这里是内容。。。
这里是内容。。。
这里是内容。。。
</text>
</view>
<view class="content">
<text>
这里是内容。。。
这里是内容。。。
这里是内容。。。
</text>
</view>
</block>--> <!-- hidden 标签任然会工作,只是不显示在界面上 -->
<view class="content" hidden="{{ !show }}">
<text>
这里是内容。。。
这里是内容。。。
这里是内容。。。
</text>
</view>
<!-- wx:if当条件为假的时候是不渲染(这个标签不工作) -->
<view class="content" wx:if="{{ show }}">
<text>
这里是内容。。。
这里是内容。。。
这里是内容。。。
</text>
</view>
</view>
</view>
.item {
border: 1px solid #ccc;
border-radius: 3px;
width: 200px;
} .item .title {
border-bottom: 1px solid #ccc;
background-color: #f0f0f0;
padding: 10px;
} .item .content {
padding: 10px;
font-size: 16px;
}
//index.js
//获取应用实例
var app = getApp()
Page({
data: {
show: false
},
//事件处理函数
toggle: function () {
this.setData({ show: !this.data.show })
}
})

wx-show与!show的更多相关文章

  1. wx.onMenuShareTimeline使用注意事项

    我在开发测试过程中,发现使用wx.onMenuShareTimeline无效果,没有显示我定义的图片.title和链接,经过调试发现原因如下: 1.图片大小要大于300pix才能显示 2.这个方法必须 ...

  2. 微信小程序 wx.uploadFile在安卓手机上面the same task is working问题解决

    微信小程序上传图片的时候,如果是多图片上传,一般都是直接用一个循环进行wx.uploadFile 这个在电脑上面测试与苹果手机上面都不会有什么问题 但当用安卓测试的时候,你会发现小程序会提示一个the ...

  3. 微信 小程序 drawImage wx.canvasToTempFilePath wx.saveFile 获取设备宽高 尺寸问题

    以下问题测试环境为微信开发者0.10.102800,手机端iphone6,如有不对敬谢指出. 根据我的测试,context.drawImage,在开发者工具中并不能画出来,只有预览到手机中显示. wx ...

  4. wx.ListCtrl简单使用例子

    效果图: 示例代码: #! /usr/bin/env python #coding=utf-8 import wx import sys packages = [('jessica alba', 'p ...

  5. wx.html2.WebView在 target="_blank" or rel="external" 没有反映的解决方法

    在wx.html2.EVT_WEBVIEW_LOADED中,用WebView.RunScript运行删除链接目标的脚本 javaScriptStr = '''function deleteBlank( ...

  6. referenceerror wx is not defined 微信JsSdk开发

    如果你和我一样遇到了“referenceerror wx is not defined”错误,很有可能是jweixin-1.0.0.js与你其它某js冲突. 解决办法: <script type ...

  7. wxPython安装错误问题:No module named wx

    今天心血来潮安装wxPython,本机win7,且已经安装Python,版本为2.7.3,然后IDE使用的PyCharm,然后wxPython下载的版本为:wxPython2.8-win32-unic ...

  8. 微信企业号 jsSDK wx.config报invalid signature错误,导致api接口无法使用

    最近在做公司定制化的时候发现一个问题,使用微信的语音API的时候微信报错,错误信息为:the permission value is offline verifying 但是诡异的是:同样的代码在我们 ...

  9. PIL Image 转成 wx.Image、wx.Bitmap

    import wx from PIL import Image def ConvertToWxImage(): pilImage = Image.open('1.png') image = wx.Em ...

  10. wx

    wx The classes in this module are the most commonly used classes for wxPython, which is why they hav ...

随机推荐

  1. Vue项目无法使用局域网IP直接访问的配置方法

    一般使用 vue-cli 下来的项目是可以直接访问局域网 IP 打开的,比如 192.168.1.11:8080 .但是最近公司的一个项目只可以通过 localhost 访问. 需要配置一下,才可直接 ...

  2. 在Windows10中安装与配置Nginx

    一.使用环境: Windows 10 1909 nginx 1.16.1 二.安装与配置: 1. 打开链接,http://nginx.org/en/download.html 下载稳定版本nginx ...

  3. linux for games; steamos; fedora game distribution

    最近对linux 游戏发行版系统产生了兴趣,下面简要记录一些链接: https://itsfoss.com/linux-gaming-distributions/ (9 款游戏系统) https:// ...

  4. 2019年Java面试题基础系列228道(3)

    51.类 ExampleA 继承 Exception,类 ExampleB 继承ExampleA. 有如下代码片断: try { throw new ExampleB("b")}c ...

  5. 如何使用 RxJS 更优雅地进行定时请求

    在用 Angular 做项目的时候,遇到了一个有点麻烦的问题.具体问题如下: 轮循请求某个接口,如何保证接口返回的数据与请求的顺序相同? 实际的业务场景是这样的:前端需要轮循请求后端接口获取文件处理进 ...

  6. mysql如何处理高并发(转)

    mysql高并发的解决方法有:优化SQL语句,优化数据库字段,加缓存,分区表,读写分离以及垂直拆分,解耦模块,水平切分等. 高并发大多的瓶颈在后台,在存储mysql的正常的优化方案如下: (1)代码中 ...

  7. C语言——线性表及其应用

    程序要求 1.建立含n个数据元素的顺序表并输出该表中各元素的值及顺序表的长度.2.利用前面的实验先建立一个顺序表L={21,23,14,5,56,17,31},然后在第i个位置插入元素68.3.建立一 ...

  8. 剑指offer笔记面试题7----重建二叉树

    题目:输入某二叉树的前序遍历和中序遍历的结果,请重建该二叉树.假设输入的前序遍历和中序遍历的结果中都不含重复的数字.例如,输入前序遍历序列{1, 2, 4, 7, 3, 5, 6, 8}和中序遍历序列 ...

  9. swift声明属性为某个类型同时遵循某协议

    swift声明属性为某个类型同时遵循某协议 var instanse:(协议A & 类B)

  10. MySQL数据库:函数的应用

    字符串截取 # 从左边开始 第1个字符 left(字段名,1) # 从那里开始,截取几个 substring(字段名,1,1) str函数 # 连接字符串 concat(s1,s2,s3,--,sn) ...