使用v-if的情况踩坑

1、子组件使用v-if的时候，如果想要使用子组件的方法，在子组件上面加上ref，父组件在DOM结构改变后调用，如下图

子组件

 

 父组件

 

2、如果在元素外层使用v-if或者v-show的时候，在DOM结构渲染的时候，当v-if/v-show的时候，则会产生问题，具体问题可以与逻辑有关

v-if：不渲染该DOM节点，如果与该DOM节点有关的计算，在控制台中央会报错

v-show：渲染该DOM节点，并将其设置为display：none，在计算的时候，不会报错，可以通过在代码中console.log查看DOM的宽高。