<template>
	<img :src="imgObj.src" alt="" :style="{width: imgObj.width,height: imgObj.height,'object-fit': imgObj.mode, 'border-radius': 0} ">
</template>

<script lang="ts" setup>
	import { ref, onMounted, defineProps, watch, computed } from 'vue';
	const props = defineProps({
		imgObj: {
			type: Object,
			default: {}
		}
	});

	interface imgType {
		src ?: String,
		width ?: Number,
		height ?: Number,
		mode ?: String,
	}
	const imgObj = ref<imgType>({
		src : '',
		width: 0,
		height : 0,
		mode : '',
	})
	
	watch(() => [props.imgObj], (newVal: any) => {
		if(newVal[0]) {
			imgObj.value = newVal[0]
		}
	}, { immediate: true })
</script>

<style>
</style>