Vue passing data to a component?

Question

Vue.js

Hello everyone, I have a component:

<template>
    <label :for="_id" class="label-file">
        <input
            :id="_id"
            :name="_name"
            :required="_required"
            :disabled="_disabled"
            type="file"
            class="label-file__form-control">

        <div class="label-file__init">
            <SvgUploadGradient />                                                       

            <div class="label-file__meta">
                <div class="label-file__title">{{ title }}</div>
                <div class="label-file__description">{{ description }}</div>
            </div>       
        </div>
    </label>
</template>

<script>
import SvgUploadGradient from '@/components/Svg/Upload/Gradient.vue'

export default {
    components: {
        SvgUploadGradient
    },

    props: {
        title: {
            default: 'Прикрепить файл',
            type: String
        },
        description: {
            default: 'Максимальный размер не должен превышать 10 мб.',
            type: String
        },
        _id: {
            default: '',
            type: String
        },
        _name: {
            default: '',
            type: String
        },
        _required: {
            default: true,
            type: Boolean
        },
        _disabled: {
            default: false,
            type: Boolean
        }
    }
}
</script>

On the required page, I call this component like this:

<FormFileInput
                                    id="p12"
                                    name="p12"
                                    required="true"
                                    title="Прикрепить файл"
                                    description="Максимальный размер до 10 мб. Допустимый формат .p12."
                                />

Passed id, name, required are assigned to label, but not to input, how can I fix this? Help me please :)

Answer 1

export default {
inheritAttrs: false
}

<template>
<input
            v-bind="$attrs"
            type="file"
            class="label-file__form-control">
</template>

Remove corresponding attribute props