Javascript try 创建一个从列表中删除任务的按钮，但过滤方法不起作用

我能够推送值，但不确定过滤的错误在哪里.如果我使用的过滤方法错误或是其他原因，有人能指导我吗？

import { useState } from 'react';

const App = () => {
const [task,setTask] = useState('');
const [list,setList] = useState([]);

const submitHandler = (event) => {
  event.preventDefault();
  const newTask = { id: new Date().getTime().toString(), title: task };
      setList([...list, newTask]);
      setTask('');
}

const clearList = () => {
  setList([]);
}

const removeItem = (id) => {
    const filteredList = list.filter(item => item.id !== id);
    setList(filteredList);
}

  return <div>
          <h2>To do list!</h2>
          <form onSubmit={submitHandler}> Enter Task! 
          <input type='text'
            onChange = {(event) => {setTask(event.target.value)}}>
          </input>
          </form>
          <div>
          {list.map((obj) => (
          <h4 key={obj.id}>{obj.title}<button onClick={removeItem}>X</button></h4>))}
          <button onClick={clearList}>Clear All</button>
          </div>
          </div>
}

export default App