【微信小程序】隐藏和显示的方式

wx:if 与hidden都可以控制微信小程序中的元素的显示与否。

先演示下两种方式的山岁蠢使用

wx:if 的使用

wx:if 还可以配合wx:else 使用，用来显示隐藏不同的控件

当isShow true显示test 隐藏test1；当isShow false时显示test1 隐藏test

hidden的使用

当isHidden true时 test隐藏 isHidden false时 test显示

wx:if 和hidden的差别

wx:if的隐藏是不渲染控件

hidden的隐藏是渲染控件，但是不显示

看下面效果

在xml布局中可以看到显示了三个控件，hidden隐藏的部分依然被渲染。

在实际开发过程中，如果频繁切换的话，用wx:if因为逗陪要雀租频繁销毁和渲染，会消耗更多的资源。

如果不是频繁切换可以考虑使用wx:if，防止页面初始化时一下渲染那么多。

1、hidden 所在view可能包含display:flex ，将其去掉便可

2、使用在组件上的hidden不生效，例如：

此时，需要在组件的外面添加一个view，例如：

便可生效了。

总结：hidden在使用的过程中，饥没会与display：flex产生冲突，但是，flex的优先级高于none或春耐block，不会生效；2、hidden对块状扒肢春布局才会生效，不可直接使用在组件上。

可以把微信小程序隐藏起来兄盯。

打开微信“我”的页面，然后打开“设置”

2. 然后点开设置，在设置页面有个“通用”

3. 点开通用，再点开“发现页管理”

4. 打开发现页管理，把“小程序”关掉

5. 这样再返回“发现”页面看，就乎老看不见小程序啦，”小程序“已经被岁尘升隐藏了

---