Advertisement

当图片路径无法加载图片时如何解决使用占位图显示的问题

阅读量:

当img标签所引用的图片无法正常加载时,原本应显示图片的位置将会呈现出一个碎片状的图标。

在这里插入图片描述

如何运用占位图,实现这一效果

在这里插入图片描述

【此时有必要对 img 标签所具备的 onerror 事件进行一番了解:

当文档或图像在加载过程中出现异常情况时,onerror 事件将被激活并执行相应的处理操作。

示例代码展示

在结构中:

复制代码
    <img width='100%' :src="imgs" alt="picture" :onerror="errorImg">
    
    
      
    

在Vue框架构建的工程项目中

复制代码
    data() {
    const nullImage = require('@/assets/images/loading.png')
    return {

全部评论 (0)

还没有任何评论哟~