vue隐藏元素的方法(vue控件的隐藏和显示)

vue中通过什么指令控制元素显示隐藏?可以是用v-if v-else 或者v-show指令控制元素显示隐藏,vue隐藏元素的方法有哪些呢?如下5种方法,本文讲解vue控件的隐藏和显示。

vue隐藏元素的方法

方法1、v-if v-else 指令 

方法2、v-show

方法3、display:none & opacity:0

通过属性绑定还是 ref获取到dom元素在设置display:none 或者 设置透明度即可

把元素移到文档可视区之外(transform:translate()) 变相隐藏,显示,结合动画实现炫酷效果

方法4、路由 meta

 定义路由时,就可以在路由对象中设置 meta属性,meta:{showdom:true}, 然后使用 v-show=“”$route.meta.showdom“” 就可以控制元素的隐藏和显示了

方法5


  

版权声明:
作者:Joker 链接:https://456787.xyz/archives/899
文章版权归作者所有,转载请注明出处。
THE END
分享
二维码
打赏
< <上一篇
下一篇>>