【Debug】v-if的节点加了class导致了数据不能加载

v-if的作用：创建与销毁。会根据v-if的布尔值来判断要创建还是销毁。

class类名：一般是用来添加样式

 

在使用vue框架时，v-if和class类名难免会混用在一起。

区别是：

如果v-if的节点上没有class类名的话，v-if在刚开始是不会渲染的。在执行的过程中，会判断v-if的布尔值，如果是true则渲染节点。

如果v-if的节点上有class类名的话，v-if在刚开始就会渲染一次，然后在执行的过程中，会判断v-if的布尔值，如果是true则再次渲染节点。一共会渲染2次

 

多渲染一次也没什么不好。

 

但正好，我有一个子组件，里面的watch里使用了nextTick一次性定时器，在定时器里面进行了赋值。结果二次赋值失败了，因为v-if渲染了2次，但nextTick只赋值了1次。

这才导致了奇怪的bug:

加了class会导致数据不能加载，不加class就一切正常。

 

 

留此笔记