I am making a todos list where I want to delete data that is stored in the array, by using array filter. but I get error from the below code
This is the following code

                  const onDelete = (id) => {
                    setaddItem((prevData) => {
                        console.log(prevData);
                
                    });
                  }
        I want to use it as : 
         const onDelete = (id) =>{
               setaddItem((prevData) =>{
                  prevData.filter((value, index) =>{
                      return index !== id;
        })})}

But why iam getting this error I don't know plz help. I have pasted the whole code below of my todos list.           
  
    function App() {
      const [addItem, setaddItem] = useState([]);
    
      const addNote = (note) => {
        setaddItem((prevData) => {
          console.log(prevData);
          return [...prevData, note];
        });
      };
    
      const onDelete = (id) => {
        setaddItem((prevData) => {
            console.log(prevData);
    
        });
      }        
      return (
        <>
          <Header />
          <CreateNote passNote={addNote} />
          {
            addItem.map((val, index) => {
              return (
                <Note
                  key={index}
                  id={index}
                  title={val.title}
                  content={val.content}
                  deleteItem={onDelete}
                />
              );
            })}
          <Footer />
        </>
      );
    }   
    export default App;

This is todos list where I have found an error please resolve, I have also imported all the above mention function.

error is : additem.map function is not defined

CodePudding user response：

Try to change the onDelete function like this

const onDelete = (id) => {
  const filteredData = [...addItem].filter((value, index) => index !== id);
  setaddItem(filteredData);
};