在Vue项目中,有v-if 和v-show两种方法来控制控件的是否显示问题
1、使用v-if相当于是/**/对改行的标签代码进行了注释
2、是v-show相当于修改了标签的style.display为‘none’
注意:当时在使用v-if和ref是有注意事项的例如
<img v-if="show" ref="img">
如果在show = false 的情况下使用this.$refs.img,是无法获取到标签的
相反使用v-show则没有这种问题
如果使用了v-if并且在show = false的情况下,在promise的then方法里使用了
this.$refs.img ,由于无法获取到标签对象,这个时候在promise,then中相当与一个错误,此时catch就会捕捉到这个错误信息,
如下图的错误实例
<img v-if="false" ref="img">
promise.then((reason)=>{
1、//获取到this.$refs.img 为undefine,会传递错误的信息,此时会执行catch代码
console.log(this.$refs.img)
}).catch(error=>{
2、//执行错误的回调函数
})
promise的一点理解
promise.then((reason)=>{
}).catch(error=>{
})
以上的函数写法相当于下面的写法(伪代码)
promise.then((reason)=>{
//如果有错误
throw errormsg
}).catch(error=>{
})