CODEWITHSUNDEEP
javascriptarraysreactjsfrontend
Vedant Shah
Vedant Shah

Reputation: 1396

How to remove element(s) from a state array variable?

I have a state variable tasks, which is an array of objects:

const [tasks, setTasks] = useState([
    {
      user: "",
      text: "Finish this page",
      deadline: new Date("05/01/2022"),
      complete: true,
      priority: "high",
      project: "Gravity",
      // ToDo: Set priority based on date while creating task
    },
    {
      text: "Finish Pierian UI/UX",
      deadline: new Date("05/10/2022"),
      complete: false,
      priority: "med",
    },
    {
      text: "Finish Internship",
      deadline: new Date("05/05/2022"),
      complete: false,
      priority: "low",
    },
    {
      text: "Anaadyanta",
      deadline: new Date("05/12/2022"),
      complete: false,
      priority: "med",
    },
    {
      text: "Random task",
      deadline: new Date("05/19/2022"),
      complete: false,
      priority: "high",
    },
  ]);

I want to remove elements whose complete is true. I am unable to think of the correct syntax while using setTasks. Please help.

Upvotes: 1

Views: 47

Answers (2)

I-vasilich-I
I-vasilich-I

Reputation: 258

you should pass callback inside setTasks:

setTask((prevTasks) => prevTasks.filter(({ complete }) => !complete));

The prevTasks always going to be the latest state, React insures it. You should always use callback when next state relies on previous. Also the name of prev variable passed in callback could be whatever you choose, here I named it prevTasks.

Upvotes: 1

Alex Tom
Alex Tom

Reputation: 221

You should filter tasks and set new state:

const updatedTasks = tasks.filter((el)=> el.complete !== 'true');
setTasks(updatedTasks);

Upvotes: 2

Related Questions