Cannot read properties of undefined (reading 'target') while tying in input

[rameshkondra]

`import React, { useState } from "react";
import "../Styles/Todos.css";

function Todos() {
const [task, setTask] = useState("");
const [todos, setTodos] = useState([]);

let onInputEnter = (e) => {
setTask(e.target.value);
};

let onSubmitHandler = (e) => {
e.preventDefault();
let newTodos = [...todos, task];
setTodos(newTodos);
setTask("");
};

let deleteHandler = (indexValue) => {
let newTodos = todos.filter((todo, index) => index !== indexValue);
setTodos(newTodos);
};

return (

Todos Application using React js

    <form onSubmit={() => onSubmitHandler()}>
      <input
        className="input-field"
        name="task"
        placeholder="Enter here..."
        value={task}
        onChange={() => onInputEnter()}
      />
      &nbsp;
      <button className="btn" name="Add" type="submit">
        Add
      </button>
    </form>
    {todos.map((todos, index) => {
      return (
        <div key={index}>
          <h3>
            {todos} &nbsp; &nbsp;
            <button onClick={() => deleteHandler(index)}>delete</button>{" "}
          </h3>
        </div>
      );
    })}
  </center>
</div>

);
}

export default Todos;
`