31 lines
675 B
Vue
31 lines
675 B
Vue
<template>
|
|
<span>
|
|
<img v-show="src && !fallback" @load="hideFallback" @error="showFallback" :src="src" :width="width" :height="height" />
|
|
<span v-show="!src || fallback"><slot></slot></span>
|
|
</span>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps({
|
|
src: {
|
|
type: String,
|
|
},
|
|
width: {
|
|
type: Number,
|
|
},
|
|
height: {
|
|
type: Number,
|
|
}
|
|
});
|
|
|
|
const fallback = ref(false);
|
|
|
|
const showFallback = () => toggleFallback(true);
|
|
const hideFallback = () => toggleFallback(false);
|
|
|
|
function toggleFallback(toggle: boolean): void
|
|
{
|
|
console.log("Something happened")
|
|
fallback.value = toggle;
|
|
}
|
|
</script> |