How to remove item form array?

Question

I have the following array in my React naitve app.

  const [items, setItems] = useState([
    { answers: [{ id: 1 }, { id: 2 }] },
    { answers: [{ id: 1 }] },
    { answers: [{ id: 1 },] },
  ]);

I want to delete item from first row with id 2 So the final should look like that

[
    { answers: [{ id: 1 }] },
    { answers: [{ id: 1 }] },
    { answers: [{ id: 1 }] },
  ]

How can i do that ? I tried to start like this

  const onDelete = useCallback((itemId) => {
    var newItems = [...items];

    newItems = newItems[0].answers.filter(....) //I don't know how to continue

    setItems(newItems);
  }, []);

Sorry for the question but I'm new to react-native and javascript!

rjumatov · Accepted Answer · 2022-07-17 17:15:55Z

2

Assuming that you want to change the first object and you want do dynamically filter the answers based on your itemId, the onDelete function would look like this:

  const onDelete = useCallback((itemId) => {
    setItems((prev) => [
      { answers: prev[0].answers.filter(({ id }) => id !== itemId) },
      ...prev.slice(1),
    ]);
  }, []);

answered Jul 17, 2022 at 17:15

rjumatov

3,5102 gold badges20 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

rjumatov · Accepted Answer · 2025-03-17 11:50:52Z

1

I've expanded @rjumatov answer to allow removing answer ids at any index.

const onDelete = useCallback((answerId=2,itemIndex=0)=>{
  const newItems = [...items];
  let currentItem = newItems[itemIndex]
  currentItem.answers = currentItem.answers.filter(({id})=> id !== answerId)
  newItems[itemIndex] = currentItem;
  setItems(newItems);
},[]);

edited Mar 17 at 11:50

rjumatov

3,5102 gold badges20 silver badges32 bronze badges

answered Jul 17, 2022 at 17:51

PhantomSpooks

3,6202 gold badges10 silver badges16 bronze badges

Comments

trincot · Accepted Answer · 2022-07-17 17:13:54Z

0

You should create a new object, whose answers property is the filtered original. The filter callback can be ({id}) => id != 2:

   newItems[0] = { answers: newItems[0].answers.filter(({id}) => id != 2) };

answered Jul 17, 2022 at 17:13

trincot

357k38 gold badges282 silver badges338 bronze badges

Comments

emy · Accepted Answer · 2022-07-17 17:22:05Z

0

newItems = newItems.map(item => { return item.answers.filter(answer => answer.id !== 2)})

answered Jul 17, 2022 at 17:22

emy

6781 gold badge9 silver badges23 bronze badges

1 Comment

PhantomSpooks Over a year ago

I dont think this would work as it delete all answer keys of the id 2 and alter items to be nothing a list of ids

Collectives™ on Stack Overflow

How to remove item form array?

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related