Как я могу сгруппировать элементы по их значениям

Question

<ul>
        <li v-for="item in birth" :key="item.id">
          <div v-for="infos in item.infos" :key="infos.pic">
            <div class="day">Birthday : {{infos.date}}</div>
            <img class="photo" :src="infos.pic">
            <div class="name">{{infos.name}}</div>
          </div>
        </li>
      </ul>

Мне нужно отобразить некоторые данные, и я хочу сгруппировать их по дням рождения. На данный момент они отображаются так:

Дни рождения: 06/28 фильм Стив

Дни рождения: 06/28 фильм John

Дни рождения: 06/30 фильм Chris

И я хочу, чтобы они отображались вот так

Дни рождения: 06/28 фильм Стив, фильм John

Дни рождения: 06/30 фильм Chris

Можно ли сделать это напрямую с помощью v-for и некоторого v-if?

Answer 1

Я не думаю, что вы можете сделать это напрямую с помощью vue. Я бы перестроил данные так, чтобы они подходили вам на стороне сервера или использовали вычисленную сторону клиента.

Answer 2

Попробуйте использовать это groupBy в lodash: https://lodash.com/docs/4.17.11#groupBy