In this video, we'll see how to delete the two item or the note so that when we click on this are removed
from basketball or some delete function.
Then it should delete nature, disappear from the screen.
Lindsey, how to do that?
So first to click that.
But this to perform a supplement request.
This should be a button.
The delete icon should be a button.
So we'll make it as a button.
The bottom.
Inside this bottom, we need to have this political.
So as you can see, whenever you click on a button on, it should perform an action, so on click.
It should call some function called handle.
So when this function is gone, we'll write the code for that function.
So function.
And you click.
So whenever they call this function, then we have to call a functioning set of dogs that takes the
idea of this idea of this note item.
But that's why we are sending this idea in the note component.
This idea will be next.
That means we are sending the next item that we want to delete.
OK.
So help us and that we will use props that there should be a function.
So will have that function on delete.
Props up 80.
So it was handing the item 80, the item which we want to delete from got it by calling 900 function
props so that we have to catch here.
Insert have.
Elizabeth Clifford handling and everything.
So you're on the lead.
We have to have this prop on the lid.
Then it should call a function delayed, not.
OK, so this delayed not takes the parameter as this problem started will right the function for that
delayed, not off the bat, so function.
The lead.
Not.
Griffith Diary.
And then said, North, I'll explain the code lineman and operate in the.
It it's not.
Return.
We have not not felt that.
This will take two parameters note item.
For my next.
The index.
Articles from A.
Nobody wants to.
So I guess I'm this chicken.
Yeah.
So everything is fine.
That is some.
OK.
So, yeah, so what is happening is here inside the delete note function, basically a baking diary
of the item that we want to delete from that.
And so the delete from that is that means we have to change the value of this note array, right?
So that's going to change this value.
We have to call this if not so a function that not functions will take the parameters of the previous
value of the notes constraint.
So until the previous not waterboard are the two new items that are available in the notes.
It will take that as a parameter.
And then what we are returning is going to be a returning area that filters the item that they're having
that are not having the index that are equal to that.
So basically, they're having the array of items, for example, five items, then we want the third
item to be deleted.
So it is filtering all the items that are present and said that it which have not having this like equals
to index so which are not equivalent.
The next article so that that means we are filtering one, two, four and five objects other than zero
three that will in turn will be stored in that and we are running that at it.
So that means we have this is how the filter function works.
Basically, we are filtering that image on the condition that is given.
One thing is for the north, the north will now contain the value of the dollar will be the item after
deleting the item that we wanted that the user is prompting a study by clicking on the delete function.
So are basically doing this by, say, a new function as props on the left retaining a function.
So whenever a person clicks on this button, we are calling the problem and then we are sending that
item so that we can get this idea.
We are using this function and then deleting the item that we want or delete from that area.
So this is how the delete mechanism is done.
You can check here.
I am giving some random thing.
We are getting a note.
And then once they click on this basket, they are deleting it.
And so you can also.
So it continues.
I'm deleting this.
You can see that getting deleted and getting it.
So everything is fine.
Now we are like adding the nodes.
Leading the nodes, like the functionality that we want to perform is done.
But now, as you can see in the May no website initially, be it having a take a note to create area
only.
But then when the user clicks on this, then it is expanding to title and taking note.
And also there is some action in the background a footer like Copyright 2021 and also the design for
the notes, right?
The note is like a good enough, not very ugly as in the case here.
So now we'll tackle these problems the animation over here, the background color of the footer, the
styling part of the notes.
So these are the remaining parts for us to complete.