How to stop adding duplicate data to Array in react.js

Question

I followed the approach as the answer in this question suggested The issue is that I want to construct an Array using setState and I dont; want to add duplicate data.

here is the sample data

const data = [
  {
    parentId: '1',
    userChoice: 'NO',
    child: []
  },
  {
    parentId: '2',
    userChoice: 'NO',
    child: []
  },
}

I'm catching the parentId from question.id from user input. If there is the same question then I don't want to concat into the array.

This is how I'm trying.

const [data, setData] = useState([]) // state

function arrayHandler(question) {
    const hasParentId = data.find((parentId) => question.id === parentId)
    // concat if array do not have any question with same id. 
    if (!hasParentId) {
      setData((data) => data.concat({ parentId: question.id, userChoice: 'NO', child: [] }))
    }
}

But this is not working, How can I fix this ?

Your find callback is accessing the object incorrectly, perhaps you meant to desctructure? data.find(({parentId}) => question.id === parentId); also since you're using the result as a boolean you might use some() instead const hasParentId = data.some(({parentId}) => question.id === parentId); — pilchard
– pilchard, Commented Mar 24, 2022 at 20:40
Yes , you are right , thanks it's working now. Thanks @pilchard — atropa belladona
– atropa belladona, Commented Mar 24, 2022 at 20:42

CaseyC · Accepted Answer · 2022-03-24 23:16:38Z

1

You can check if any of the elements in the data have a matching ID using Array.some and if not then you can use concat or just the spread operator to add the new object to the existing data.

function arrayHandler(question) {
  if (!data.some((d) => question.id === d.parentId)) {
    setData((data) => [...data, { parentId: question.id, userChoice: "NO", child: [] }]);
  }
}

answered Mar 24, 2022 at 23:16

CaseyC

1,49214 silver badges23 bronze badges

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

Comments

ido ben ami · Accepted Answer · 2022-03-24 21:15:00Z

0

I think that now it shold work

function arrayHandler(question) {
const hasParentId = data.find((object) => question.id === object.parentId)
// concat if array do not have any question with same id. 
if (!hasParentId) {
  setData((data) => data.concat({ parentId: question.id, userChoice: 'NO', child: [] }))
}

}

answered Mar 24, 2022 at 21:15

ido ben ami

1565 bronze badges

Collectives™ on Stack Overflow

How to stop adding duplicate data to Array in react.js

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related