vue 图片404问题

Posted qq364735538

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 图片404问题相关的知识,希望对你有一定的参考价值。

img标签,当src的url404时

1、使用默认图片代替

<img style="margin-left: 40px;width: 130px;height: 130px;" :src="url" @error="nofindImg()"/>

    nofindImg(){

      let img = event.srcElement;

      img.src = "../../../static/404.png";

      img.onerror = null; //防止一直跳动

    },

2、not found,直接删除标签

<img style="margin-left: 40px;width: 130px;height: 130px;" :src="url"  :οnerrοr="default"/>

data中定义默认图地址

  data() {

    return {

       default: ‘this.remove()‘

    };



作者:踩着阳光
链接:https://www.jianshu.com/p/c83ed05c57a1
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

以上是关于vue 图片404问题的主要内容,如果未能解决你的问题,请参考以下文章

vue代码上传服务器后背景图片404解决方法

vue-cli3项目中解决动态引入图片img404的问题

vue 判断当前图片地址是否404

vue打包后空白页问题全记录 (background路径,css js404,jsonp等);

js当图片返回404时如何展示默认图片

vue + vue-lazyload 实现图片懒加载