方法一:通过onerror属性加载默认图片
<img :src="img" :onerror="defaultImg" /><script>
export default {name: 'testImgError',data() {return {img: '', // 访问图片的ip地址defaultImg: `this.src = '${require('@/assets/images/right/default-person.png')}'`, };},
}
</script>
方法二:通过@error方法加载默认图片
<img :src="img" @error="handleError" />export default {name: 'testImgError',data() {return {img: '', // 访问图片的ip地址defaultImg: require('@/assets/images/right/default-person.png'),};},methods: {handleError(e) {e.target.src = this.defaultImg;},},
}
</script>