How to pass input value to parent?

Question

Vue.js

I have an array, and I want the input value to be added to the array when the button is pressed, but it should be entered undef
here is the code
//===================== ========================================
parent component

<template>
    <div id="app" class="container">
      <h1> {{ title }} </h1>
        <TodoInput :items="items" @push="pushForItem" ></TodoInput>
        <TodoList></TodoList>
    </div>
</template>

<script>

    import TodoInput from "./components/TodoInput";
    import TodoList from "./components/TodoList";

    export default {
      props: {
        value: String
      },

      data() {
        return {
          title: "TodoList",
          items: [],
        }
      },
      components: {
          TodoInput,
          TodoList
      },
      methods: {
          pushForItem() {
              var input = this.value;

              if ( this.value !== "" ) {
                  this.items.push({
                      text:input
                  })
              }
          }
      }
    }

</script>

//=============================================== ========================
//======================== ==============================================
child component

<template>
    <div>
        <input type="text" v-model="value">
        <button class="btn btn-outline-secondary" @click="addItem">Add</button>
    </div>
</template>

<script>

    export default {
        props: {
            items: {
                type: Array
            },
            onValue: {
                type: String
            }
        },
        data() {
            return {
                value: ""
            }
        },

        methods: {
            addItem() {
                this.$emit("push", this.value);
            }
        }
    }

</script>

Answer 1

I advise the author of the post to re-read the meaning of props and work with events coming from child components.
The answer above solves the problem.