how can i prevent creating new duplicate item in javascript

Question

here is a link to my code https://codesandbox.io/s/strange-bash-0n1bf?file=/src/components/TagEditor.vue I have created a tag input with vue js here I am adding new item by input entry I want to prevent duplicate tag name

addTag (name) {
    if ( this.tags.length < 6 )  {
      this.tags.push({
      id: String(Math.floor(Math.random() * 9)),
      name,
      })
      this.name = ""
    }
  },

hope someone could help me with it

You can use the includes() function to see if there is a duplicate: stackoverflow.com/questions/237104/… — AlexSp3
– AlexSp3, Commented Jul 31, 2021 at 23:28

LeeLenalee · Accepted Answer · 2021-07-31 23:31:39Z

2

You can map your tags object array to an array containing only the string names and see if the name is already in use, if this is the case ignore the entry (might still want to clear the input field)


    addTag(name) {
      if(this.tags.map(e => e.name).includes(name)) {
        return;
      }
      if (this.tags.length < 6) {
        this.tags.push({
          id: String(Math.floor(Math.random() * 999999999)),
          name,
        });
        this.name = "";
      }
    },

Codesandbox

answered Jul 31, 2021 at 23:31

LeeLenalee

31.9k7 gold badges62 silver badges81 bronze badges

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

Collectives™ on Stack Overflow

how can i prevent creating new duplicate item in javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related