Vue中v-show和v-if的使用以及区别

/ 0 条评论 / 216人阅读

V-if

    1.v-if 根据条件渲染,它会确保在切换过程中条件块内的组件销毁和重建                

    2. v-if如果在初始渲染时条件为假,则不会渲染条件块,直到条件变为真时,才会开始渲染条件块

V-show

  v-show 不管初始条件是什么,元素总是会被渲染,只会根据条件的真假,在display:block 和display:none 之前切换


注意事项

当出现v-show以及v-if不生效,没有根据数组中的值的变化而变化时,请检查数组中值的变化是否通过Vue.set来执行修改,例如

以下代码中:

<div v-show="items[0].isShow"></div>

使用这种方式修改数字中元素的值是错误的

正确的写法应该如下:

item=items[0]     
Vue.set(item,"isShow",true)


Responses /