微信小程序–hidden不生效原因及解决方案

翻看之前的印象笔记，看到了之前的遗留问题，总结在此，便于查看。

先说结论：

hidden不生效和display为flex有关，可以利用动态属性设置display属性。

微信官方文档里有提到说hidden是所有组件都有的属性，但事实及编码中发现并不是这样的，有条件限制。

小程序中有代码为：

会发现hidden没生效，经过我的实验发现这段代码中hidden元素对flex布局不生效，对块布局才生效，所以这段代码李导致hidden没生效的原因是display：flex.

但是这个布局一定要用到flex布局怎么办？

其实这里想用hidden无非就是想控制布局的显示，display：none也可以做到影藏显示，这里有个取巧的方式，动态设置display属性。（三元运算符）

这里的hidden是在对应的js里是一个变量，有js来动态控制。

注意：hidden隐藏布局，但是会占空间，display:none 隐藏但是不占空间