標簽在vue中的使用

定義和用法

onerror 事件會在文檔或圖像加載過程中發生錯誤時被觸發。

在裝載文檔或圖像的過程中如果發生了錯誤，就會調用該事件句柄。

 

實例 加載縮略圖

<img :src="'/xxxx/downLitimg.do?xxxID='+xxxid" onerror="javascript:this.src='${sysHostUrl}/static/img/pdf_icon.png'">

vue寫法:src="'/xxxx/downLitimg.do?xxxID='+xxxid"  調后台接口

加載縮略圖失敗后會去加載一張默認的圖片:onerror="javascript:this.src='${sysHostUrl}/static/img/pdf_icon.png'"

 

java后台代碼：

/**
 * 下載縮略圖
 *
 * @param ArchiveDetailUUID
 */
@GetMapping(value = "downLitimg.do")
public void downLitimg(String ArchiveDetailUUID,String YearMonth, HttpServletRequest request, HttpServletResponse response) {
    try {
        AfdataLitimg entity=afdataLitimgService.find(ArchiveDetailUUID,YearMonth);
        if (entity != null && entity.getLitimgData()!=null && entity.getLitimgData().length>0) {
            
            response.setContentType("image/jpeg");
            OutputStream toClient = new BufferedOutputStream(response.getOutputStream());
            toClient.write(entity.getLitimgData());
            toClient.flush();
            toClient.close();

            return;
        }else{
            System.out.println("圖片加載沒有數據C，getLitimgData=null"+ArchiveDetailUUID);
            return;
        }
    } catch (IOException ex) {
        System.out.println("圖片加載異常D，"+ArchiveDetailUUID+"-----"+ex.getMessage());
        LogerHelper.WebLog(ex.getMessage());
        return;
    }
}

實際效果gif：