微信小程序控制盒子显示隐藏_微信小程序动态的显示或隐藏控件的方法(两种方法)...

在微信小程序开发时，经常要用到一个控件会根据不同的情况和环境动态显示与隐藏这种情况，下面就来实践一把！上效果先

它的实现方法有两种，

第一种方法：单选法，就是隐藏与显示根据条件二选一，代码如下:

我是被显示被隐藏控件

第二种方法：叠加法，就是先隐藏，如果是显示，再叠加一个显示，如果是隐藏就不动，代码如下：

我是被显示被隐藏控件

这种办法一开始看有点头晕，所以把它分解成两个状态：

显示状态:

因为showView是true，所以我们把它转成如下样子

我是被显示被隐藏控件

看到了吧，后面的bright789_view_show会把前面的bright789_view_hide重叠上去，注意这里是重叠，所以顺序不能反过来像bright789_view_show {{showView?'':' bright789_view_show '}}这种是不行的

隐藏状态:

相当于如下代码:

我是被显示被隐藏控件

最后我把demo的js,wxml和wxss代码贴一下:

Js文件:

Page({

data:{

showView:true

onLoad:function(options){

// 生命周期函数--监听页面加载

showView:(options.showView=="true"?true:false)

}

,onChangeShowState:function(){

var that=this;

that.setData({

showView:(!that.data.showView)

})

}

})

Wxml文件代码:

我是被显示被隐藏控件

Wxss文件代码：

.bright789-text{

font-size: 40rpx;

line-height: 40px;

color: #ff0000;

}

.bright789_view_hide{

display: none;

}

.bright789_view_show{

display: block;

}

微信小程序控制盒子显示隐藏_微信小程序动态的显示或隐藏控件的方法(两种方法)...相关推荐

中文顿号怎么输入_键盘上顿号怎么打出来顿号用键盘打出来的两种方法
顿号是我们标点符号中经常会使用的一种,在纸上书写的时候,大家只需要写一个一个斜划线即可,可是在电脑上输入,很多人往往不知道如何输入顿号.那么顿号在键盘上怎么打?顿号怎么打出来?下面脚本之家小编就为大家 ...
winform datagridview 没有出现垂直滚动条上下_照片从水平垂直矫正，再到黑白留色，两种方法快速处理...
不知道大家有没有发现,我们平时出去玩拍照的时候,尤其是拍建筑,拍的照片经常不垂直,建筑的整个轮廓都是倾斜的,仿佛要倒了......(前提是你本来想拍水平垂直的) 其实出现这种情况很正常,第一个原因容易 ...
把EXCEL表格导入到MYSQL中_将EXCEL表格中的数据导入mysql数据库表中（两种方法）...
今天项目上遇到需要将excel中的数据导入到数据库的classify表中,于是乎拼命上网查阅方法,发现以下两种方法比较可行: 在此之前先说说按照网上的说法我没有试验成功的方法,将excel文件xls保 ...
微信小程序动态的显示或隐藏控件
在微信小程序开发时,经常要用到一个控件会根据不同的情况和环境动态显示与隐藏这种情况,下面就来实践一把!上效果先它的实现方法有两种, 第一种方法:单选法,就是隐藏与显示根据条件二选一,代码如下: &l ...
华硕主板无盘启动bios设置_最新华硕主板进BIOS设置U盘启动的两种方法
华硕这家台湾企业在主板领域一直是处于领头羊的地位,旗下的主板以质量优异获得大量用户的青睐.下面小编就讲讲最新华硕主板如何进bios设置u盘启动,在此介绍两种方法. 方法一:利用启动热键快速设置 1.开 ...
python numpy读取数据_大神教你python 读取文件并把矩阵转成numpy的两种方法
导读今天小编就为大家分享一篇python 读取文件并把矩阵转成numpy的两种方法,具有很好的参考价值,希望对大家有所帮助.一起跟随小编过来看看吧在当前目录下: 方法1: file = open( ...
python大神读取_大神教你python 读取文件并把矩阵转成numpy的两种方法
导读今天小编就为大家分享一篇python 读取文件并把矩阵转成numpy的两种方法,具有很好的参考价值,希望对大家有所帮助.一起跟随小编过来看看吧在当前目录下: 方法1: file = open( ...
判断机器是大端还是小端（两种方法）
什么是大端序,小端序?? 其实就是字节的存储顺序,如果数据都是单字节的,那怎么存储无所谓了,但是对于多字节数据,比如int,double等,就要考虑存储的顺序了. 举个例子: 一个32位 int 型变 ...
小程序发布上线流程_微信小程序开发流程的两种方法科普
现在微信小程序早已渗透到我们日常生活的方方面面,很多商家看到了小程序带来的巨大流量,也想开发一个自己的小程序.所以今天就跟大家科普下微信小程序开发流程,你会发现这个开发过程其实非常简单. 1. 在微信 ...

微信小程序控制盒子显示隐藏_微信小程序动态的显示或隐藏控件的方法(两种方法)...

微信小程序控制盒子显示隐藏_微信小程序动态的显示或隐藏控件的方法(两种方法)...相关推荐

最新文章

热门文章