VUE выдает ошибку Cannot read properties of undefined (reading 'value')

Изучаю VUE и пытаюсь написать список задач, но ни как не могу связать input с получение от него значением. Как только ввожу символ выходит в консоли два предупреждения

"runtime-core.esm-bundler.js:41 [Vue warn]: Unhandled error during execution of native event handler" и ошибка

Main.vue:15 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'value')
    at Proxy.inputHandler (Main.vue:15:38)
    at callWithErrorHandling (runtime-core.esm-bundler.js:158:18)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:166:17)
    at emit (runtime-core.esm-bundler.js:669:5)
    at runtime-core.esm-bundler.js:7478:45
    at handleInput (input.vue:428:7)
    at callWithErrorHandling (runtime-core.esm-bundler.js:158:18)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:166:17)
    at HTMLInputElement.invoker (runtime-dom.esm-bundler.js:595:5)


```
<script>
export default {

  data() {

   return {
      title: 'Список заметок',
      placeholderName: "Введите задачу",
      inputValue: '',
      notes: [],
     }
  },
  methods:{
    inputHandler(event){
      this.inputValue = event.target.value;
    },
    addNewNote(){
     this.notes.push(this.inputValue);
    },
  },
}
</script>

<template>
  <el-main>
    <h1 class="title">{{title}}</h1>
    <el-row>
      <el-col :span="12" >
        <el-input
            type="text"
            v-bind:placeholder="placeholderName"
            v-bind:value="inputValue"
            v-on:input="inputHandler"
        ></el-input>
        <el-button v-on:click="addNewNote">Добавить запись</el-button>
      </el-col>
    </el-row>
    <hr>
    <el-row>
      <el-col :span="12" >
        <ul class="list">
          <li class="list-item" v-for="item in notes">{{item}}<el-button>Удалить запись</el-button></li>
        </ul>
      </el-col>
    </el-row>
  </el-main>
</template>
``` 

Подскажите где что я не так делаю?