Vue中判断图片是否加载成功和失败
在vue项目开发过程中,可能需要进行一些图片的处理,用来根据图片的状态进行对应的处理。
·
在vue项目开发过程中,可能需要进行一些图片的处理,用来根据图片的状态进行对应的处理。
一、获取图片是否加载完成事件
通过img标签自带的onload事件,
当给定的图片 URL 地址存在且图片加载完成,则触发onload
事件。
<img class="container" @load='imgOnError' :src="status?startPng:stopPng" alt="" />
二、获取图片是否记载成功事件
当给定的图片 URL 地址不存在或网络出错时,则触发onerror
事件。可以通过该事件进行逻辑的处理。
<img class="container" @error='imgOnError' :src="status?startPng:stopPng" alt="" />
更多推荐
已为社区贡献14条内容
所有评论(0)