img图片加载错误时显示默认图片

JavaScript用的onerror事件，vue用的@error

JavaScript写法

<img src="xxx" onerror="this.src='default-image.png'">

vue写法：

<img :src="img_in" @error="setDefaultImage">import bgWhite from '@/assets/images/bg-white.png';export default {data() {return {img_in: bgWhite, // 加一个白色背景图，就是在加载图片的时间避免闪一下上次的图片defaultImg:require('@/assets/images/remote-default-img.png'),};},methods: {// 接口获取图片showImgDialog( {this.img_in = xxxx;},// 加载失败设置默认图片setDefaultImage(e) {e.target.src = this.defaultImg},},};