fix(默认图片): 处理默认图片的展示问题

This commit is contained in:
hzj 2025-09-22 17:29:23 +08:00
parent 88a66cc5ca
commit dac67869d5
3 changed files with 16 additions and 8 deletions

View File

@ -23,7 +23,7 @@
> >
<div :style="{ width: isTopOne ? '50%' : '80%' }"> <div :style="{ width: isTopOne ? '50%' : '80%' }">
<img <img
:src="avatarUrl" :src="avatarUrl || ''"
alt="" alt=""
width="100%" width="100%"
style="border-radius: 50%; aspect-ratio: 1/1; object-fit: cover" style="border-radius: 50%; aspect-ratio: 1/1; object-fit: cover"

View File

@ -256,9 +256,10 @@
" "
> >
<img <img
:src="listItem.userAvatar" :src="listItem.userAvatar || ''"
alt="" alt=""
style="width: 90%; aspect-ratio: 1/1; border-radius: 50%; object-fit: cover" style="width: 90%; aspect-ratio: 1/1; border-radius: 50%; object-fit: cover"
@error="defaultAvatarUrl"
/> />
</div> </div>
@ -458,8 +459,8 @@
style=" style="
background-size: 100% 100%; background-size: 100% 100%;
min-height: 20px; min-height: 20px;
margin: -10px 0; margin: -20px 0;
padding: 10px 10%; padding: 20px 10%;
" "
:style="{ backgroundImage: `url(${images['border-item']})` }" :style="{ backgroundImage: `url(${images['border-item']})` }"
> >
@ -531,7 +532,7 @@
" "
> >
<img <img
:src="reward.cover || '/src/assets/icon/coin.png'" :src="reward.cover || ''"
alt="" alt=""
width="50%" width="50%"
style="aspect-ratio: 1/1" style="aspect-ratio: 1/1"
@ -831,6 +832,13 @@ const handleImageError = (e, type) => {
} }
} }
//
const defaultAvatarUrl = (e) => {
console.log('头像资源出错')
e.target.onerror = null //
e.target.src = new URL('/src/assets/images/WeeklyStar/defaultAvatar.png', import.meta.url).href
}
// //
const getTopList = async (params) => { const getTopList = async (params) => {
const resWeekTopList = await getWeekTopList(params) const resWeekTopList = await getWeekTopList(params)

View File

@ -269,7 +269,7 @@
> >
<!-- gift图 --> <!-- gift图 -->
<img <img
:src="gift.cover" :src="gift.cover || ''"
alt="" alt=""
style="width: 50%; display: block" style="width: 50%; display: block"
@error="(e) => handleImageError(e, gift.type)" @error="(e) => handleImageError(e, gift.type)"
@ -444,7 +444,7 @@
<div style="color: #edb247; font-weight: 700">{{ myRanking.rank || 999 }}</div> <div style="color: #edb247; font-weight: 700">{{ myRanking.rank || 999 }}</div>
<!-- 头像 --> <!-- 头像 -->
<img <img
:src="myRanking.userAvatar" :src="myRanking.userAvatar || ''"
alt="" alt=""
style=" style="
width: 30%; width: 30%;
@ -538,7 +538,7 @@
style="height: 100%; display: flex; justify-content: center; align-items: center" style="height: 100%; display: flex; justify-content: center; align-items: center"
> >
<img <img
:src="showTopOne.userAvatar" :src="showTopOne.userAvatar || ''"
alt="" alt=""
style=" style="
width: 50%; width: 50%;