CODEWITHSUNDEEP
javascriptarrayssortingvue.jsvuejs2
m33bo
m33bo

Reputation: 1354

Vue js searching array

I am trying to search an array for query string on a json object. The returned fields are an array of filtered results. Currently, the list is returning the name field but not the number field.

      computed: {
        search: function () {
          let self = this
          let filtered = []

          filtered = self.jcontacts.filter(function(contact){
            return  contact.firstname.toLowerCase().indexOf(self.query.toLowerCase())>=0 ||
                    contact.lastname.toLowerCase().indexOf(self.query.toLowerCase())>=0;
                    contact.email.toLowerCase().indexOf(self.query.toLowerCase()) >=0 ||
                    contact.phonenumber.toLowerCase().indexOf(self.query.toLowerCase()) >=0;
            }
          );
          return this.contacts = filtered
        }
      },
    }

The filtered method in the search method is not showing the number. An example of the json is below:

[ { "id": 1, "phoneNumber": [ "3908902" ], "email": [ "[email protected]" ], "firstname": "Jamie", "lastname": "Fox" }]

Upvotes: 0

Views: 161

Answers (2)

Manish Khedekar
Manish Khedekar

Reputation: 402

It is a typo. Check out field phoneNumber is filtered as phonenumber.

It is an array so you can do it as,

contact.phoneNumber.forEach( number => { 
   if(number.toLowerCase().indexOf(self.query.toLowerCase()) >=0) 
      return true;
});

I think similarly you can write it down for email as well because it is also an array.

Upvotes: 0

Emīls Gulbis
Emīls Gulbis

Reputation: 2070

  1. Beware of case phoneNumber != phonenumber
  2. phoneNumber is stored as array not string, so you cant look for it like that (use .includes() function for example)
  3. For code formatting consider to store self.query.toLowerCase() as variable or another computed property

Upvotes: 2

Related Questions