How to check if item already exists in array in vue.js?

Question

I have this array where i add values on click, but i want to check if value is already in array, if it is do nothing. I tried with indexOf but i get same result every time

this.fields.push(this.field);
      this.field = { value: '' };

Vladimir Salguero · Accepted Answer · 2021-03-18 15:59:37Z

8

In array of objects it is better to use Array.some()

this.users = [{id : 1, name : 'Jonh Doe'},{id : 2, name : 'Mary Jean'}]

if(!this.users.some(data => data.id === 1)){
    //don't exists       
}else{
    //exists because Jonh Doe has id 1
}

Source: https://www.samanthaming.com/

edited Mar 18, 2021 at 15:59

answered Jul 17, 2020 at 23:02

Vladimir Salguero

5,9773 gold badges49 silver badges51 bronze badges

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

2 Comments

Hashaam Ahmed Over a year ago

Helped me a lot, but I see some small error there you have "!" inside if statement so in this it says "if not" so if in your case "id" exists it will fall to else not to if. But I have used your solution thank you :)

Vladimir Salguero Over a year ago

You are right, I already corrected it, it is because in my example I wanted to perform an action when it was not found in an array ☺

Bill Criswell · Accepted Answer · 2017-01-04 00:04:04Z

5

Are you determining if it's in the array by the value property? If so you can use Array.some().

var exists = this.fields.some(function(field) {
  return field.value === this.field.value
});

if (!exists) {
  this.fields.push(this.field);
}

answered Jan 4, 2017 at 0:04

Bill Criswell

33k8 gold badges80 silver badges68 bronze badges

Comments

Md. Harun Or Rashid · Accepted Answer · 2020-05-24 10:16:33Z

This may be a detailed and easy solution.

In JavaScript or Jquery

//plain array
var arr = ['a', 'b', 'c'];
var check = arr.includes('a');
console.log(check); //returns true
if (check)
{
   // value exists in array
   //write some codes
}

// array with objects
var arr = [
      {x:'a', y:'b'},
      {x:'p', y:'q'}
  ];

// if you want to check if x:'p' exists in arr
var check = arr.filter(function (elm){
    if (elm.x == 'p')
    {
       return elm; // returns length = 1 (object exists in array)
    }
});

// or y:'q' exists in arr
var check = arr.filter(function (elm){
    if (elm.y == 'q')
    {
       return elm; // returns length = 1 (object exists in array)
    }
});

// if you want to check, if the entire object {x:'p', y:'q'} exists in arr
var check = arr.filter(function (elm){
    if (elm.x == 'p' && elm.y == 'q')
    {
       return elm; // returns length = 1 (object exists in array)
    }
});

// in all cases
console.log(check.length); // returns 1

if (check.length > 0)
{
   // returns true
   // object exists in array
   //write some codes
}

In Vue

<script>
    export default {
        data: function () {
            return {
               arr = [
                   {x:'a', y:'b'},
                   {x:'p', y:'q'}
                ],
             }
         },
        methods: {

            // assign this function to any event of any dom
            checkObjInArr = function(){

                     var check = this.arr.filter(function (elm) {
                         if (elm.x == 'a' && elm.y == 'M') {
                                 return elm;
                            }
                      });
                     console.log(check.length > 0); // returns 1
                     if (check.length > 0)
                        {
                            // returns true
                            // object exists in array
                            //write some codes
                         }
                },                
        },
     }
</script>

Collectives™ on Stack Overflow

How to check if item already exists in array in vue.js?

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related