I would like to explain my problem of the day.
currently i have an array of object
I map this table
[
{ id: "a", location: "FR", zone: "EU" } ,
{ id: "b", location: "FR", zone: "EU" } ,
{ id: "c", location: "ES", zone: "EU" } ,
{ id: "d", location: "ES", zone: "EU" } ,
]
to sort all the data I use a useEffect to retrieve only the values I need
useEffect(() => {
if (data) {
const location = data.map((e) => {
return {
label: e.location,
};
});
setLocations(locations);
}
}, [data]);
this works correctly.
except which returns me the following format
0: {label: 'FR'}
1: {label: 'FR'}
2: {label: 'ES'}
4: {label: 'ES'}
and I would like to have the following format
0: {label: 'FR'}
1: {label: 'ES'}
basically it removes the identical key
iam open to any proposal thank you very much.
Since you're using location as an id-like property that determines the uniqueness, you can do:
const data = [
{ id: "a", location: "FR", zone: "EU" } ,
{ id: "b", location: "FR", zone: "EU" } ,
{ id: "c", location: "ES", zone: "EU" } ,
{ id: "d", location: "ES", zone: "EU" } ,
];
console.log(
Array
.from(new Set(data.map(d => d.location)))
.map(label => ({ label }))
)This first transforms the list to an array of strings. It uses a Set to get rid of duplicate strings. Then, it transforms to the desired output format.
data.map(d => d.location) gives [ "FR", "FR", "ES", "ES" ]Array.from(new Set(...)) gives [ "FR", "ES" ](...).map(label => ({ label })) gives the final outputuse filter and indexOf
data = data.filter(function (value, index, array) {
return array.indexOf(value) === index;
});