<template>
    <image 
        class="image" 
        mode="aspectFill" 
        :src="src" 
        :draggable="draggable"
        @error="handleImageError"
    ></image>
</template>

<script>
export default {
    props: {
        src: {
            type: String,
            default: '',
            required: true,
        },
    },
    data() {
        return {
            draggable: false
        }
    },
    methods: {
        handleImageError() {
            this.$emit('image-error');
        }
    }
}
</script>

<style scoped lang="scss">
.image {
    width: 100%;
    height: 100%;
}
</style>