Remove repeating text and quotes in Child component in Vue JS-CodePudding

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

CodePudding user response：

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(', '))];

CodePudding user response：

You should split the CSV string

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