1、关于图片的引入有两种方式:
require路径直接引入 (1)关于require引入:
<div
>
<img
:src
='imgSrc'/>
</div
>
<script
>
created(){
this.imgSrc
= require('@/assets/default-avatar.png')
}
</script
>
(2)关于路径直接引入
<div
>
<img
:src
='@/assets/avatar.png'/>
</div
>
2、错误图片展示 在图片展示时,通过接口调用时,会出现加载延迟或者图片地址失效的情况,这个时候需要展示一张默认图片:
<img
:src
='imgUrl' @error
='handleError'/>
created(){
this.handleError()
},
methods
:{
handleError(e
){
e
.target
.src
= reqiure('@/assets/error.png')
}
}
看都看到这里了 打赏下吧 有钱出钱 没钱的点个关注叭~