Vue的導(dǎo)航欄顯示或隱藏(vue項(xiàng)目nav導(dǎo)航欄的實(shí)現(xiàn))
1需要獲取左側(cè)導(dǎo)航欄對象2綁定事件 3css中的顯示隱藏有31displayblock顯示 32display隱藏 33opacity1顯示 34opacity0隱藏,但元素不會徹底消失只是透明度為0,還是會占據(jù)空間。
需求 實(shí)現(xiàn)一個(gè)弧形的菜單欄,并將激活的菜單項(xiàng)移動(dòng)到中間位置,點(diǎn)擊按鈕可對該菜單欄進(jìn)行顯示隱藏按照圓環(huán)弧度計(jì)算每個(gè)菜單項(xiàng)應(yīng)該分布的位置并進(jìn)行設(shè)置,在點(diǎn)擊菜單項(xiàng)時(shí)更新菜單的起始角度,重新進(jìn)行分布忘了。
而底部導(dǎo)航欄是直接在Appvue根組件中使用的,登陸頁也是通過路由顯示在根組件上的,所以登錄頁沒法傳值直接控制底部導(dǎo)航欄的顯示那么我能通過什么解決了,想到了用vuex狀態(tài)管理,開工我這邊把mutations,actions,getters。
vshow 隱藏 是display#39#39 vif 隱藏是 visibilityhiddendisplay和visibilityhidden的區(qū)別是1display是徹底消失,不在文檔流中占位,瀏覽器也不會解析該元素visibilityhidden是視覺上消失了,可。
掃描二維碼推送至手機(jī)訪問。
版權(quán)聲明:本文由飛速云SEO網(wǎng)絡(luò)優(yōu)化推廣發(fā)布,如需轉(zhuǎn)載請注明出處。