How to correctly pass props of the form inputEl.value?

Question

Vue.js

Hello, I'm still learning vue. Decided to create separate base components for input, textarea, etc.
But I can't figure out how to correctly pass their props to the main component?

I'll show you the input component as an example.
The input component itself is in el-input.vue

<template>
  <div>
    <b-form-group :id="inputGroupId" :label="label" :label-for="inputId">

      <input type="text"
             :value="title"
             :placeholder="placeholder"
             :id="inputId"
             class="mw-100"
             @input="handleChange($event.target.value)">
    </b-form-group>
  </div>
</template>

<script>
export default {
  name: "el-input",
  props: {
    inputGroupId: String,
    inputId: String,
    label: {
      type: String,
      default: 'Label'
    },
    type: String,
    placeholder: String,
    title: ''
  },
  methods: {
    handleChange (ev) {
      this.$emit('input', ev)
    }
  }
}
</script>

it is connected to a modal window, which is also a separate component, I will show you how to connect it:

<elInput
                    :input-group-id="inputEl.groupId"
                    :input-id="inputEl.id"
                    :label="inputEl.label"
                    :type="inputEl.type"
                    :placeholder="inputEl.placeholder"
                    v-model="inputEl.value"
                />

export default {
components: {
    elInput
  },
data() {
    return {
      inputEl: {
        label: "Текст",
        id: "input-element",
        groupId: "input-group-element",
        type: "text",
        placeholder: "Текст",
      },
  props: [
'inputEl.value'
  ]
}

So, how to correctly pass inputEl.value so that in the main component I can work with the text in this field?

Answer 1

https://ru.vuejs.org/v2/guide/components.html#%D0%...