图片添加空状态
This commit is contained in:
@@ -1,5 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, onUnmounted, reactive, toRefs } from 'vue'
|
import { ref, onMounted, onUnmounted, reactive, toRefs } from 'vue'
|
||||||
|
import nullImg from '@/assets/images/shopping-cart-null.png'
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
url: {
|
url: {
|
||||||
type: String,
|
type: String,
|
||||||
@@ -41,7 +42,7 @@
|
|||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="commodity-item" :class="{ 'is-download': download }">
|
<div class="commodity-item" :class="{ 'is-download': download }">
|
||||||
<img :src="props.url" alt="" @click="openDetail" />
|
<img :src="nullImg" v-loadimg="props.url" alt="" @click="openDetail" />
|
||||||
<div class="detail">
|
<div class="detail">
|
||||||
<div class="text">
|
<div class="text">
|
||||||
<div class="name">
|
<div class="name">
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ export default {
|
|||||||
};
|
};
|
||||||
function loadImage(el, src) {
|
function loadImage(el, src) {
|
||||||
if (!src) return
|
if (!src) return
|
||||||
|
if (el.src === src) return
|
||||||
const img = new Image()
|
const img = new Image()
|
||||||
img.src = src
|
img.src = src
|
||||||
img.onload = () => {
|
img.onload = () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user