vue图片加载失败 空白页的解决方案@error函数

@error函数

vue项目中 img标签加载失败(404)方法，@error事件。

也可以用于项目中空白页的研发。

img标签中有一个onerror事件。是当引用的src属性获取不到图片，或者网络错误导致无法正常显示src属性的图片时，显示的提示错误图片或者是可以代替的万能图片。

@error就是onerror。

如何使用？

html代码：

 img
    :src="item.imageUrl"
    class=""
    @error="imgError"
 />

JavaScript代码：

    imgError(e) {
    
      e.srcElement.src = require("图片地址");

    }
,

可能出现的问题

碎片图标反复闪烁

    imgError(e) {
    
      e.srcElement.src = require("图片地址");
    
      e.srcElement.onerror=null;

    }
    ,

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！