Axios VueJs Response Map Unique

Question

I am trying to retrieve car manufacturer ID's using AXIOS within VueJs front-end and Spring back-end.

In the code provided below I have achieved that, however some of the ID's repeat(this is meant to happen), the question is how is it possible to filter out the duplicate ID's?

My getMethod below.

   getMethod () {
            AXIOS.get(`/url/`)

                .then(response => {
                        if (response.status == 200) {

this.response = response.data                                     
                            this.myTest = response.data.map(mesg => mesg.carManufacterId)
                            console.log(this.myTest)

                        }
                    },
                    (err) => {                

                       if (err.response.status == 500) {

                            console.log('turned off')
                        }
                        else if (err.response.status == 404) {                         
                                console.log('Could not retrieve)
                        }
                    })

        },

Possible duplicate of [How to get unique values in an array](https://stackoverflow.com/questions/11246758/how-to-get-unique-values-in-an-array) — Styx, Jan 09 '19 at 19:19
Your question is "How to remove duplicates from array?", that's the same as "How to get unique values in an array?". — Styx, Jan 10 '19 at 10:14

score 2 · Accepted Answer · answered Jan 09 '19 at 19:25

You achieve that by looping through your response data array and check in each iteration if the new item is already in myTest array based on carManufacterId:

this.myTest = []
response.data.forEach(item => {

  if (!this.myTest.some(rec => {
      return item.carManufacterId === rec.carManufacterId
    })) {
    this.myTest.push(item);
  }
});

Axios VueJs Response Map Unique

1 Answers1