增加卖家默认头像默认背景
This commit is contained in:
BIN
src/assets/images/avatar.png
Normal file
BIN
src/assets/images/avatar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 128 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 713 KiB After Width: | Height: | Size: 121 KiB |
27
src/directives/avatarLoad.js
Normal file
27
src/directives/avatarLoad.js
Normal file
@@ -0,0 +1,27 @@
|
||||
// 加载图片
|
||||
import avatar from '@/assets/images/avatar.png'
|
||||
export default {
|
||||
name: 'avatarLoad',
|
||||
mmounted(el, binding) {
|
||||
loadImage(el, binding.value)
|
||||
},
|
||||
updated(el, binding) {
|
||||
// 当 binding.value 发生变化时重新加载
|
||||
if (binding.oldValue !== binding.value) {
|
||||
loadImage(el, binding.value)
|
||||
}
|
||||
},
|
||||
};
|
||||
function loadImage(el, src) {
|
||||
if (!src) return
|
||||
|
||||
const img = new Image()
|
||||
img.src = src
|
||||
img.onload = () => {
|
||||
el.src = src
|
||||
}
|
||||
img.onerror = () => {
|
||||
el.src = avatar // 默认头像
|
||||
console.log('图片加载失败:', src)
|
||||
}
|
||||
}
|
||||
@@ -25,7 +25,7 @@ const {} = toRefs(data);
|
||||
<div class="item">
|
||||
<div class="left">
|
||||
<div class="portrait">
|
||||
<img :src="item.avatar" alt="">
|
||||
<img v-avatarLoad="item.avatar" alt="">
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="name">{{ item.shopName }}</div>
|
||||
|
||||
@@ -7,6 +7,7 @@ import myEvent from '@/utils/myEvent'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { getDesignerDetail } from '@/api/brand'
|
||||
import { AddShoppingCart } from '@/api/shoppingCart'
|
||||
import brandDetailBg from '@/assets/images/brand/brandDetailBg.png'
|
||||
|
||||
//const props = defineProps({
|
||||
//})
|
||||
@@ -54,7 +55,7 @@ defineExpose({})
|
||||
<template>
|
||||
<div class="brand">
|
||||
<div class="header-img">
|
||||
<img :src="designerDetail.brandBanner || '@/assets/images/brand/brandDetailBg.png'" alt="">
|
||||
<img :src="designerDetail.brandBanner || brandDetailBg" alt="">
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="merchant-info">
|
||||
|
||||
@@ -31,7 +31,7 @@ const {} = toRefs(data);
|
||||
<template>
|
||||
<div class="merchantInfo">
|
||||
<div class="profile">
|
||||
<img :src="designerDetail.avatar || '@/assets/images/collectionStory/Rectangle.png'" alt="">
|
||||
<img v-avatarLoad="designerDetail.avatar" alt="">
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="detail">
|
||||
|
||||
@@ -131,7 +131,7 @@ defineExpose({})
|
||||
</div>
|
||||
<div class="commodity">
|
||||
<div class="info">
|
||||
<img class="profile" :src="detail.avatar" alt="">
|
||||
<img class="profile" v-avatarLoad="detail.avatar" alt="">
|
||||
<div class="detail">
|
||||
<div class="name">{{ detail.shopName }}</div>
|
||||
<div class="release-time">
|
||||
|
||||
Reference in New Issue
Block a user