<template>
    <div class="mb-4 row">
        <label :for="name" class="col-md-2 col-form-label">{{ title }} </label>
        <div class="col-md-10">
            <input class="form-control" type="file" :id="name" @change="changeHandler" multiple />
        </div>
    </div>
</template>

<script setup>
const prop = defineProps({
    title: {
        type: String,
        default: '라벨',
        required: true,
    },
    name: {
        type: String,
        default: 'nameplz',
        required: true,
    },
});

const emits = defineEmits(['update:data']);

const changeHandler = (event) => {
    const files = Array.from(event.target.files);
    emits('update:data', files);
};
</script>

<style>
</style>
