CODEWITHSUNDEEP
vue.js
user13928344
user13928344

Reputation: 216

Remove repeating text and quotes in Child component in Vue JS

I'm looking for some help to remove duplicate words, commas and [] in an array of objects output in a child component.

PARENT

 <Countries
              v-for="(result, index) in countries"
              :result="result"
              :index="index"              
            />

CHILD

<div v-if="country" >
       {{country}}
            </div> 



mounted () {    
    this.country = [...new Set(this.result.results.country)];
    
  },

data: function () {
    return {
    name: this.result.results.country
}

JSON data

"result": [
"results": {
"country": "Poland, France, Germany, Poland, Latvia, Estonia, Germany, Germany, France", 
},
"results": {
"country": "Poland, France, Germany, Poland, Latvia, Estonia, Germany, Germany, France", 
},
"results": {
"country": "Poland, France, Germany, Germany, France", 
},
"results": {
"country": "Greece, Spain", 
},
.....

This is the OUTPUT I am getting [ "G", "r", "e", "c", ", ",", "S", "p", "a", "i", "n",", " ]

It splits the data and removes duplicate letters. How can I get it to just split the words, remove duplicate entries and remove the quotes and the commas? So the output would just be

Greece, Spain

Thank you

Upvotes: 0

Views: 50

Answers (3)

Roh&#236;t J&#237;ndal
Roh&#236;t J&#237;ndal

Reputation: 27192

We are using Set object is to remove the duplicates from an input which could be any iterable value. i.e. string or an array.

  • If we are passing a string, it will check character by character and remove duplicate characters.
  • If we are passing an array, it will check element by element and remove the duplicate elements.

As per your requirement, First you have to convert that countries string into an array by using Array.split() method and then you can remove the duplicate names.

Live Demo :

const country = "Poland, France, Germany, Poland, Latvia, Estonia, Germany, Germany, France";

const arr = country.split(', ');

console.log([...new Set(arr)].join());

Upvotes: 1

Arik
Arik

Reputation: 6501

You should split the CSV string

mounted () {    
    this.country = [...new Set(this.result.results.country.split(',')];
}

Upvotes: 1

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

Try to split the string by ', ' and create the set based on the array from the split result :

 this.country = [...new Set(this.result.results.country.split(', '))];

Upvotes: 2

Related Questions