В массиве 10 объектов, представляющих игроков, и я пытаюсь перебрать и отобразить 5 игроков из команды 1 в Vue.js.Я делаю это правильно?

Question

this.match.details.participants содержит массив из 10 объектов, которые представляют игроков.У каждого игрока есть свойство teamId, которое используется для определения того, входит ли он в первую или вторую команду.Я пытаюсь перебрать всех участников и отобразить первую команду в 1 столбце на странице, а вторую команду в 2 столбце на странице.

Я в основном разобрался, но я 'Мне интересно, если моя реализация в порядке, и есть ли лучшие альтернативы.В настоящее время я сделал это следующим образом:

<div v-for='friendly in friendlyTeam'>
    {{ friendly }}
</div>
<div v-for='enemy in enemyTeam'>
    {{ enemy }}
</div>

data(){
    return {
        match: null
    }
},
computed: {
    friendlyTeam(){
        let friendlyTeamId = this.match.mainParticipant.teamId; // id is either 100 or 200
        let friendlyTeam = this.match.details.participants.filter(value => value.teamId === friendlyTeamId);

        return friendlyTeam;
    },
    enemyTeam(){
        let enemyTeamId = 0;
        let friendlyTeamId = this.match.mainParticipant.teamId; // id is either 100 or 200
        if (friendlyTeamId == 100) {
            enemyTeamId = 200
        } else if (friendlyTeamId == 200) {
            enemyTeamId = 100
        }
        let enemyTeam = this.match.details.participants.filter(value => value.teamId === enemyTeamId );

        return enemyTeam;
    }
}

Это возвращает массив из 5 объектов, которые представляют игроков в дружной команде.Это прекрасно работает, но мне кажется, что мне придется скопировать и вставить все вычисленное свойство и немного изменить его, чтобы получить вражескую команду, что нарушит принцип СУХОЙ.

Есть ли лучшие альтернативы тому, что я сделал?Является ли использование вычисляемого свойства для извлечения только тех объектов, которые мне нужны, а затем зацикливание на них, хорошая идея?

Answer 1

Вы можете немного изменить рефакторинг.

if (friendlyTeamId == 100) {
        let enemyTeamId == 200
    } else if (friendlyTeamId == 200) {
        let enemyTeamId == 100
 }

Изменить на:

let enemyTeamId = friendlyTeamId === 100 ? 200 : 100