Vue.js Only Show Objects With A Unique Property
I am building a Leaderboard. I have a collection of leaders. There are multiple entries from the same teams. I would like to only show one entry per team (most recent preferably).
Solution 1:
Since you tagged the question computed-properties, you're on the right track. Just create a computed property that limits the trackers to unique teams.
computed: {
teams() {
returnthis.trackers.reduce((teams, tracker) => {
if (teams.find(team => team.team_id === tracker.team.team_id) === undefined) {
teams.push(tracker.team);
}
return teams;
}, []);
}
}
Then use the computed property in your template.
<divv-for="team in teams":key="team.team_id"><div>{{team.team_name}}</div></div>
If you need the tracker information associated with the team, create a computed property for unique trackers instead.
Post a Comment for "Vue.js Only Show Objects With A Unique Property"