在微信小程序开发时，经常要用到一个控件会根据不同的情况和环境动态显示与隐藏这种情况，下面整理了5种常用的 方法。
控制元素的 hidden 属性： 在 WXML 文件中，可以给需要控制显示和隐藏的元素添加 hidden 属性，并将其设置为一个变量，通过改变该变量的值来控制元素的显示和隐藏。
<view hidden="{{hiddenn}}">这是要显示或隐藏的元素</view>
在对应的 JavaScript 文件中，可以通过改变 isHidden 变量的值来控制元素的显示和隐藏。
Page({
data: {
isHidden: false, // 默认显示
},
toggleHidden() {
this.setData({
isHidden: !this.data.isHidden,
});
},
});
通过调用 toggleHidden 方法，可以改变 isHidden 变量的值，从而控制元素的显示和隐藏。
使用opacity属性<view style="opacity:{{opacity}}">显示或隐藏</view>
使用opacity可以达到隐藏显示的效果，一般是用在背景遮罩的场景。
使用display属性<view style="display:none">显示或隐藏</view>//元素不显示
<view style="display:block">显示或隐藏</view>//元素显示使用绝对定位
使元素脱离文档流，通过改变元素的top和left属性值控制元素的显示与否。这种方法比较少用。
使用wx:if指令<view wx:if="{{3>2}}">显示或隐藏</view>
这是我们比较常用的方法，简单直观。
总结
如果组件的显示/隐藏切换地频率很高时，选择使用“hidden”,如果组件的显示/隐藏切换地频率很低时，选择使用“wx:if”。
【注意事项】
1.wx:if / wx:else 设置组件的显示/隐藏时，是控制组件的重新创建、渲染，无法记录组件隐藏前的数据。因此，组件隐藏后再显示时需要记录之前的数据时推荐使用 hidden 属性。
,2.需要注意的是，hidden属性无法直接应用于 “自定义组件” 和 “非块级元素” 的显示/隐藏，解决方法：在外面包裹一层<view></view>。
