微信小程序通过点击按钮控制元素隐藏与显示

目录

一、效果图：

二、代码

js：

wxml：

一、效果图：

二、代码

js：

Page({data:{hidden:false,},// 隐藏yincang:function(e){setTimeout(function () {this.setData({hidden: true})}.bind(this), )},// 显示xianshi:function(e){setTimeout(function () {this.setData({hidden: false})}.bind(this), )},})

wxml：

<view style="text-align: center;"><view hidden='{{hidden}}' ><image mode='widthFix' src='https://gd-/f3b0ddffcf31f47a4bb6ed1cca127b4665a30a2f35598-fR8uq4'></image><button style="margin-top: 25rpx;" type="warn" bindtap='yincang'>隐藏</button></view><view wx:if="{{hidden}}"><!-- <image mode='widthFix' src='https://gd-/8de549e728eff85248a619a845bc00409f277adf18b8d-zALOF3'></image> --><button style="margin-top: 25rpx;" wx:if="{{hidden}}" type="primary" bindtap='xianshi'>显示</button></view></view>