一、隱藏的幾種方式：
1猫牡、Vue的
v-if滚局、小程序的wx:if
- 說明：物理級(jí)別的顯示與隱藏；即：直接處理DOM節(jié)點(diǎn)
動(dòng)態(tài)的向DOM樹內(nèi)添加或者刪除DOM元素(不存在于節(jié)點(diǎn)樹)- 特點(diǎn)：
- 有惰性：如果在初始渲染條件為 false米诉，框架什么也不做
- 有局部編譯/卸載的過程，因此有更高的切換消耗
2篷帅、Vue的
v-show史侣、小程序的hidden3惊橱、
visibility: hidden4、其它技巧：想辦法讓其不可見(透明税朴、移出視界回季、縮小) 或這些組合
- 透明
支持動(dòng)畫{ opacity: 0;/*透明度為0*/ backface-visibility: hidden;/*元素不面向屏幕時(shí)是否可見*//*如果在旋轉(zhuǎn)元素不希望看到其背面時(shí)，該屬性很有用正林。*/ pointer-events: none;/* 鼠標(biāo)事件穿透自身*/ }
- 移出視界
支持動(dòng)畫{ position: absolute; top: -999em; /* 不占據(jù)空間泡一，無法點(diǎn)擊 */ } { position: relative; top: -999em; /* 占據(jù)空間，無法點(diǎn)擊 */ } {-webkit-transform: translate3d(0, -100%, 0);transform: translate3d(0, -100%, 0);}
- 縮小
支持動(dòng)畫{ zoom: 0.001; -moz-transform: scale(0); -webkit-transform: scale(0); -o-transform: scale(0); transform: scale(0); } { height: 0; overflow: hidden; /* 不占據(jù)空間卓囚，無法點(diǎn)擊 */ }
