本文共 480 字,大约阅读时间需要 1 分钟。
相同点
都可以控制dom元素的显示隐藏
不同点
1,v-if:控制dom元素的显示隐藏是将整体的元素添加或者删除
2,v-show:控制dom元素的显示隐藏是将css样式display,设置none或者是block,DOM元素是还存在的
所以一个dom元素是存在的一个是不存在的
实现本质方法区别
vue-show本质就是标签display设置为none,控制隐藏
vue-if是动态的向DOM树内添加或者删除DOM元素
性能对比
v-if有更高的切换消耗;
v-show有更高的初始渲染消耗 v-show只编译一次,后面其实就是控制css,而v-if不停的销毁和创建,故v-show性能更好一点。
v-if:
在请求后台接口,用接口返回数据渲染生成多个元素的时候,由于网速太慢,导致数据刚开始没有值,此时我们页面也会进行渲染空数据就会报错。 我们可以把一个元素作为包装元素,并使用v-if 进行条件判断,如果有值,才会显示内部元素。最终的渲染不会包含这个元素,v-show是不支持这么做的。v-show:
适用于频繁切换;例如选项卡,题诗的弹出框转载地址:http://pkylf.baihongyu.com/