处理加载失败的情况: 可以为el-image组件绑定@error事件,当图片加载失败时执行相应的处理逻辑。例如,可以显示一个默认的错误图片,或者提示用户图片加载失败。 vue <el-image :src="imagesrc" @error="handleerror"> <div slot="error" class="image-error"> <el-image :src="require('@...
首先,图片加载失败后会触发标签绑定error的函数srcerr,srcerr接收到的参数不必解释,必须要传,有用; /^err/.test(this.imgList[index])(注意这里匹配的不是item,下面你会明白为什么)判断该图片的链接是否以err开头,第一次触发error当然不是了。 那么执行this.$set(this.imgList, index, ‘err’ + item),当然...
试了很久,这个可能是el-image的bug吧,以后需要仔细看看源码怎么实现的。 目前发现有两个解决办法,第一个就是在“:src” 里添加默认图片地址,避免渲染DOM的时候找不到地址导致报错;第二种就是本来我只想要使用他的大图预览功能,我想是不是可以设置成img加载图片,只需要找预览的功能,后来发现Image这块大图预览是个组...
使用el-image显示图片加载失败 代码: <el-imagestyle="width: 100%; height:50px; margin:4px 5px 2px 5px;"src="../assets/logo1.png"/> 效果: 解决:src用里面加个require 代码: <el-imagestyle="width: 100%; height:50px; margin:4px 5px 2px 5px;":src="require('../assets/logo1.png'...
图片路径没有任何问题,页面没有报错,但是图片加载失败。然后给图片路径加了一个判断: 这样,当goodsPic被赋值之后会再次渲染一下标签,就可以显示图片了。
修改HelloWorld.vue(增加使用el-image及其他组件), 跑起来后, el-image对应的图片显示加载失败, 但如果换成绝对地址就能正确加载, 不知道什么原因! 问题出现的环境背景及自己尝试过哪些方法 相关代码 // 请把代码文本粘贴到下方(请勿用图片代替代码)main.js import Vue from 'vue' import ElementUI from 'element...
场景一：部分图片加载成功、部分图片加载失败 <el-imagev-if="isShowImage"style="width: 300...
在上面的代码中,我们定义了一个名为handleError的方法,该方法将在图片加载失败时被调用。在这个方法中,我们可以进行一些错误处理操作,比如显示错误提示、替换默认图片等。 总结起来,Vue3中ElImage组件的onerror事件是一个非常实用的功能,它可以帮助我们处理图片加载失败的情况。通过合理地使用onerror事件,我们可以提高网...
下图是获取数据的 图片的地址是可以正常访问的,如果加载失败,手动刷新的,就可以正常访问了! <el-image v-if="infoDetails.Url" alt="图片" :src="infoDetails.Url" :preview-src-list="[infoDetails.Url]"></el-image> 加载中...